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

duvida quanto a modularização

Boa tarde,

estou com uma duvida quanto a modularização feita do PhotoComponent.

quando criamos o PhotoModule colocamos em "imports" o modulo "HttpClientModule", gostaria de entender o pq o mesmo deveria estar exatamente nesse módulo, ja que a chamada do web service é realizada na classe "PhotoService" que diga-se de passagem é injetada, chamada nas classe "PhotoListResolver" e "PhotoListComponent", isso não fez sentido pra mim.

qual a explicação para tal importação?

7 respostas

Fala aí Allan, tudo bem? Essa é a maneira como o Angular trabalha sua injeção de dependência.

Provavelmente seu PhotoListResolver ou PhotoListComponent devem também estar sendo importados pelo PhotoModule ou sendo utilizados dentro de algum componente/página que pertence ao PhotoModule.

Sendo assim, seu módulo PhotoModule em algum momento vai precisar utilizar o PhotoService, por isso ele precisa do HttpClientModule para saber como injetá-lo via injeção de dependência no seu serviço.

É um assunto complexo mesmo, por debaixo dos panos acontece muito mais que uma simples injeção, mas, é algo bem avançado.

Espero ter ajudado.

PhotoListResolver não está em nenhum modulo, ele é chamado pelo "app.routing.ts" apenas ele.

o "PhotoListComponent" faz parte do modulo "photo-list.module.ts", exatamente como a aula ensina.

no "photo.module.ts" existe apenas o "photo-list.component.ts", nada mais alem disso.

Então, veja que seu PhotoListComponent está dentro do módulo PhotoModule, sendo assim, esse módulo vai precisar injetar o HttpClient, por isso é importado o módulo HttpClientModule dentro dele, sacou?

Espero ter ajudado.

não cara.....

meu photoListComponent está dentro do photoListModule como mencionei acima....

o "PhotoListComponent" faz parte do modulo "photo-list.module.ts"

porra, sinceramente, vc prestou atenção na minha duvida e no meu ultimo post?

no post acima falei que meu PhotoListComponent estava no PhotoListModule, no primeiro post falei que " PhotoModule colocamos em "imports" o modulo "HttpClientModule" " e agora vc me fala que:

1- PhotoListComponent está em PhotoModule 2 - e que por isso o HttpClientModule esta no PhotoModule.

continuei sem entender nada!!!!! falei onde estavam os modulos e vc misturou tudo do q falei mudando tudo de lugar!!!!!

Fala Allan, tudo bem? Primeiramente, antes de mais nada:

Vamos continuar com o respeito tudo bem? Eu estou aqui tentando te ajudar da melhor maneira que posso, estou dedicando meu tempo para isso.

Sim, eu leio todas as respostas antes de respondê-las.

Bom, olhando um pequeno trecho da sua resposta:

no "photo.module.ts" existe apenas o "photo-list.component.ts", nada mais alem disso.

Claramente diz: Dentro do meu photo.module existe o photo.list.component ou eu estou entendendo e lendo algo totalmente errado?

Segundo: Dúvidas não são contas de matemáticas, 1 + 1 = 2. Depende, eu não sei como está a estrutura do seu projeto, eu não sei como estão os seus códigos, eu não sei nada sobre seu projeto.

Então, vamos ter que ir eliminando e vendo as possibilidades do seu projeto, vamos acertar de primeira? As vezes sim, as vezes não. Temos que testar, entender e validar as ideias. Não existe uma receita de bolo ou bala de prata para os nossos problems com programação.

Já que o entendimento está "dificil", compartilhe seu projeto comigo, isso pode ser feito através do Github ou Google Drive (zipado).

Eu olho por aqui exatamente como estão suas pastas, arquivos e estrutura. Dai te falo o porque da necessidade da importação do HttpClientModule no PhotoModule.

Espero ter ajudado e desculpe qualquer problema ou mal entendido.

segue o projeto

https://github.com/arcCoelho/alurapic

solução!

Fala aí Allan, tudo bem? Desculpa a demora, está bem corrido as coisas por aqui. Dei uma olhada no seu projeto, vamos lá:

Repare no seu photos.module.ts:

@NgModule({
    imports: [
        PhotoModule,
        PhotoFormModule,
        PhotoListModule,
        CommonModule
    ],
    exports: [PhotoListComponent]
})
export class PhotosModule{}

Você está importando seus módulos nele, ou seja: PhotoModule, PhotoFormModule e PhotoListModule.

O módulo que vai precisar injetar o seu PhotoService é o PhotoListModule, pois no componente você injeta o serviço no construtor e no resolver também, então esses dois arquivos vão precisar injetar o serviço.

O ideal nesse cenário é que a declaração de HttpClientModule fosse feita no PhotoListModule e não no PhotoModule como foi feito no curso (acho que o instrutor deixou passar despercebido).

Mas, porque funcionou então? Ele vai funcionar desde que pelo menos um dos três (PhotoModule, PhotoFormModule e PhotoListModule) módulos importem o HttpClientModule ou o módulo pai de todos eles, no caso: PhotosModule.

Se nenhum desses três ou o pai importar o módulo HttpClientModule, ai seu serviço não vai conseguir usar o HttpClient pois a injeção de dependência do Angular não sabe lhe prover esse recurso.

Uma vez o módulo importado, ai você está falando para o Angular:

Olha Angular, quando eu precisar injetar algum HttpClient, você usa o HttpClientModule para me fornecê-lo.

Sim, é um pouco complexo mesmo esse gerenciamento de módulos, injeção de dependência e tals. Mas com o tempo você vai pegando o jeito.

Espero ter ajudado e desculpe qualquer problema.