Curso Angular #61: Rotas Filhas: desenvolvendo as telas

[@IsaqueGaldino]

Nos minutes 4 em diante fala para declarar a variável alunos como private, mas isso dá erro de compilação no Angular 9 error TS2341: Property 'alunos' is private and only accessible within class 'AlunosComponent' por isso precisa declará-la como public.

[@paulopintorbetim5693]

I dont believe this : a simpatic and competente teacher. look how are the amazing pronunciation of your english skills

[@alexandrefaculdade]

Loiane, passei a preferir o Angular ao invés de React graças as suas aulas. Muito obrigado. Dica aos colegas: Como não podemos usar a rota para passar o aluno, uma boa dica é que o objeto aluno seja passado como parâmetro na função de editar, só assim evitamos uma nova requisição ao servidor.

[@renatobento]

Gratidão!

[@GabrielSouza-zt2oc]

mano, eu te amo

[@LYOUTU1]

Parabéns Loiane! Sempre demonstrando um conhecimento e uma segurança invejáveis! Obrigado pela aula! O ponto negativo que você comentou sobre as rotas deve-se ao fato de não correr o risco de estar alterando um objeto obsoleto, visto que no momento em que ele está em memória no cliente, o mesmo já pode ter sido alterado por um outro usuário (concorrência). Buscar o objeto do serviço através do seu identificador, nesse caso, é sempre uma melhor prática.

[@tcarvalho87]

Esse problema você deve evitá-lo na camada de persistência no backend da aplicação. Assim não importa se vai no server e busque novamente esse objeto, a sua camada de persistência vai evitar que o cliente atualize um objeto com uma versão diferente. No meu caso que programo com o java e utilizo o ORM Hibernate, consigo resolver a concorrência utilizando a anotação @version.

[@joaopinto1428]

Suas aulas são muito claras @Loiane Groner. Gosto de assistir... Rsrsrs

[@arthurteodoro6586]

parabéns pelas aulas está me ajudando muito a aprender sobre essa nova versão do angular que achei muito melhor que a primeira.

[@Um_Zuca_Dev_Na_Ilha_da_Madeira]

Parabéns Loiane nota 10 pelo curso...

[@RubiaBornhofen]

Ótima didática! Os conceitos estão muito bem explicados e fáceis de compreender. Gostei bastante do curso e do Angular 2, em relação a versão anterior muita coisa ficou facilitada. Tem previsão de quando estará disponível as aulas sobre HTTP e utilização junto a uma aplicação backend? Obrigada pela oportunidade de aprender!

[@Cristian-0175]

Top demais a aula.

[@amandaavelino8362]

Legal, antes mesmo de chegar em formulários já temos uma base! (y) show!

[@henriquearantestiraboschi8480]

Gente você é demais!

[@leonardo280788]

Melhor vídeo ate o momento.

[@KauzeraPoa]

Show de bola, refatorando minhas rotas, apredendo cada vez mais, Vlw

[@jamalmelo]

Muito boa aula, no aguardo da próxima. Obrigado.

[@LageAfonso]

Excelente! Parabéns!

[@rodrigosafortes-developer4506]

vc é ótima

[@Triple_Kirk]

Olá Loiane, suas aulas são ótimas, fico sempre a espera da próxima aula! Você comentou sobre a questão de impossibilidade de passar o objeto pela rota diretamente, mas ha alguma forma fácil de contornar isso no lado do client? obrigado!!!

[@paulorodrigues3432]

Ter um serviço que salvar e excluí objetos no localStorage é uma opção? Com o serviço, já fazemos um reuso, passando o nome do objeto por parâmetro... Assim não precisaria ter que ir no servidor, mas em questão de performance? Ter que ficar "toda hora" gravando e puxando dados... Alguém tem uma ideia melhor e mais elegante?

[@WillianFerreiraU]

Tem, toda vez que tu tiver que usar um objeto tu passa esse dado pra service, e depois apenas buscar ele da service. Caso não tenha(tipo recarga de tela e tals), tu faz a requisição. Se tiver armazenado lá tu só busca o que estava armazenado.

[@evillynoliveira5982]

fica confuso quando corta o vídeo e aparece um monte de coisa nova, 12:58

[@linkopaladino]

só criar outro componente chamado "alunos-form" Depois chama ele no botão "editar" ou novo, no editar vc vai ter q buscar ele usando o id q recebeu com o serviço! ela mostra tudo!

[@evillynoliveira5982]

@@linkopaladino rapaz, nem lembro mais o problema... Mas se eu tive que comentar aqui é porque não tava claro PRA MIM

[@linkopaladino]

@@evillynoliveira5982 haaa foi mal !, achei que tava querendo ajuda.

[@carvalhos1296]

@@linkopaladino Meu id tá undefined e não acho o problema

[@matheusgomes9457]

Eu acho interessante não passar todos os dados pela rota, pois dessa forma meu backend poderia me fornecer uma rota que retorna 1000 alunos, por exemplo, contendo apenas NAME e ID ao invés de ADDRESS, PHOTO etc etc tornando assim o tempo de resposta da request de listagem bem mais rápido.

[@Linneker]

Curso maravilhoso, mas essa aula em questão foi tenso, só os cortes e puladas kkkk Mas deu pra dar um jeitinho. Agradecido pelo conhecimento compartilhado! =D

[@assistironlineii7988]

Você não poderia usar URL encoded e JSON.stringify para passar um "objeto" na URL? Sobre o quesito segurança, é correto reaproveitar os dados dessa forma ?

[@igorbarbosa9266]

Loiane, a renderização dos componentes na mesma tela passando o router-outlet show de bola, mas como podemos mostrar uma rota especifica em um local especifico ? Exemplo: No caso utilizado, se quiséssemos o formulário "editar" em cima da listagem e os "detalhes" abaixo da listagem ?

[@loianegroner]

Teria que montar o layout da página. Por exemplo, colocar a lista de detalhes fixos (poderia até criar componentes pra organizar melhor). E deixar a parte de editar/criar, etc como rota filha.

[@felipeabreumotta7651]

Excelente Aula!! Podemos fazer assim também: editarContato() { this.router.navigate(['editar'],{ relativeTo: this.route }) }

[@Nathan0.8]

Quando eu fiz desse jeito: " private alunos: any[] = [];" não funcionou o *ngFor. Mas quando mudei o private para public o *ngFor funcionou. Alguém sabe me explicar o pq?

[@Cristian-0175]

Por que quando uma variável ou objeto é privado só a própria classe consegue acessar. O private é uma forma de segurança para aquela variável. Quando ela é pública você consegue acessar de outros lugares. É uma explicação básica mas acho que vai dar pra você entender.

[@MrEdusi]

afervorado por Angular com essa voz

[@HeitorGiacomini]

Eu nao entendi porque quando altera o aluno dentro do alunos-form tbm altera no alunos.component

[@arozendojr]

Tem algum lugar onde posso pegar o código dessa aula. Meu componente filho não ativa o oninit por uma segunda vez, depois que está na tela. Minha rota filha é atualizado, caso escolha outro registro, a filha não e atualizado. Sabe dizer o que seria ?

[@eduardocarneirodeassis1531]

mesmo problema aqui, a url é atualizada porém o componente não é renderizado

[@arozendojr]

@@eduardocarneirodeassis1531 Resolvi na época,não me lembro agora, coloca os fontes no github, que dou uma força. caso não queira, pode compartilhar uma pasta com os fontes. Para o github tem que ignorar o /node_modules ou deleta a pasta /node_modules antes de subir para o github Para compartilhar os fontes no drive, deleta a pastas node_modules

[@andresouza8995]

Quando eu uso o this.aluno = this.alunosService.getAlunos(); dá esse erro "Expected 0 arguments, but got 1." Se alguém souber de alguma coisa pra solucionar.

[@fredericodasilva8337]

resolveu?

[@fredericodasilva8337]

você ta retornando um lista de alunos para um this.aluno.. de uma olhada nisso... talvez o certo seria this.aluno = this.alunosService.getAluno(id);

[@andresouza8995]

@@fredericodasilva8337 resolvi sim. Eu estava usando o método errado. Devia ser o getAluno(id).

[@fredericodasilva8337]

@@andresouza8995 ou você passou da aula 62? rs estou com um problema naquele lazy...

[@andresouza8995]

@@fredericodasilva8337 nossa vei agora que eu vi. passei sim. qual o seu problema?

[@regismatos]

Show

[@orlanildoads]

Outra maneira de fazer o getAluno() tentei retornar o obj direto dentro do forEach mas não deu certo, então fiz assim. getAluno(id: number){ let alunoFinded this.alunos.forEach(aluno => { aluno.id == id ? alunoFinded = aluno : null }) return alunoFinded }

[@HeitorGiacomini]

uma maneira alternativa de fazer a pesquisa por aluno: getAlunoById(id:number){ var curso = this.getAlunoList(); return curso.find(x => x.id == id); }