Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Erro : [PhotoListComponent -> ActivatedRoute]: StaticInjectorError(Platform: core)[PhotoListComponent -> ActivatedRoute]:

Estou com esse erro de injector e não sei como resolver de jeito maneira. Navegador

core.js:6014 ERROR Error: Uncaught (in promise): NullInjectorError: StaticInjectorError(AppModule)[PhotoListComponent -> ActivatedRoute]: 
  StaticInjectorError(Platform: core)[PhotoListComponent -> ActivatedRoute]: 
    NullInjectorError: No provider for ActivatedRoute!
NullInjectorError: StaticInjectorError(AppModule)[PhotoListComponent -> ActivatedRoute]: 
  StaticInjectorError(Platform: core)[PhotoListComponent -> ActivatedRoute]: 
    NullInjectorError: No provider for ActivatedRoute!
    at NullInjector.get (core.js:855)
    at resolveToken (core.js:17514)
    at tryResolveToken (core.js:17440)
    at StaticInjector.get (core.js:17266)
    at resolveToken (core.js:17514)
    at tryResolveToken (core.js:17440)
    at StaticInjector.get (core.js:17266)
    at resolveNgModuleDep (core.js:30393)
    at NgModuleRef_.get (core.js:31578)
    at resolveDep (core.js:32143)
    at resolvePromise (zone-evergreen.js:797)
    at resolvePromise (zone-evergreen.js:754)
    at zone-evergreen.js:858
    at ZoneDelegate.invokeTask (zone-evergreen.js:391)
    at Object.onInvokeTask (core.js:39680)
    at ZoneDelegate.invokeTask (zone-evergreen.js:390)
    at Zone.runTask (zone-evergreen.js:168)
    at drainMicroTaskQueue (zone-evergreen.js:559)

App routing

import { NotFoundComponent } from './errors/not-found/not-found.component';
import { NgModule, Component } from "@angular/core";
import { Routes, RouterModule } from "@Angular/router";

import { PhotoFormComponent } from "./photos/photo-form/photo-form.component";
import { PhotoListComponent } from "./photos/photo-list/photo-list.component";

const routes: Routes = [
  { path: 'user/:userName', component: PhotoListComponent },
  { path: 'p/add', component: PhotoFormComponent },
  { path: '**', component: NotFoundComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule {}

PhotoList

import { Component, OnInit } from "@angular/core";
import {ActivatedRoute} from '@angular/router';

import { Photo } from "../photo/photo";
import { PhotoService } from "../services/photo.service";

@Component({
  selector: "app-photo-list",
  templateUrl: "./photo-list.component.html"
})
export class PhotoListComponent implements OnInit {

  constructor(
    private photoService: PhotoService,
    private activatedRoute: ActivatedRoute
    ) {}

  photos: Photo[] = [];

  ngOnInit(): void {

    const userName = this.activatedRoute.snapshot.params.userName;
    this.photoService
      .listFromUsers(userName)
      .subscribe(photos => (this.photos = photos));
  }
}
2 respostas
solução!

Resolvido:

O erro era na importação em photo-list.component.ts

A importação entrou como : import { Routes, RouterModule } from "@Angular/router";

e o correto é : import { Routes, RouterModule } from "@angular/router"; com o "A" minúsculo.

Opa, Gedan! Que bom que conseguiu resolver a questão! E obrigado por compartilhar a solução conosco! Assim todos crescemos juntos! Continue assim!

Grande abraço e bons estudos, meu aluno!

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software