Angular-styleguide: Conflitos de nome de sintaxe de controladorAs

Criado em 5 nov. 2015 · 9Comentários · Fonte: johnpapa/angular-styleguide

Oi,

Algo que descobri hoje com relação à sintaxe controllerAs em Angualr 1. Em meu aplicativo Angular 1, tento aplicar a arquitetura de componente usando diretivas para definir componentes individuais. A diretiva tem seu próprio controlador com controllerAs: 'vm' . Eu também uso o roteador angular-ui para navegar entre as visualizações. O que descobri é que se eu tiver uma rota definida com controllerAs: 'vm' e usar uma diretiva dentro da visão que define controllerAs: 'vm' , o vm do controlador pai será sobrescrito. O comportamento é o mesmo, mesmo com o âmbito de aplicação isolado da diretiva. No entanto, se eu especificar nomes diferentes no parâmetro controllerAs do roteador e na diretiva (ex controllerAs: 'componentVm' ), tudo funcionará bem.

Eu queria saber se estou fazendo algo errado? Do contrário, e se este for o comportamento pretendido, provavelmente seria uma boa ideia adicionar algo ao guia de estilo mencionando os conflitos de nome de controllerAs em potencial ao usar a arquitetura de componente em Angular 1 com controladores específicos de diretiva.

Atenciosamente

Jusef

Angular 1 help wanted question

Fonte

jusefb

👍1

Comentários muito úteis

Use vm até que não esteja claro. Em seguida, use um nome mais descritivo.
É isso que eu gosto.

johnpapa em 5 set. 2016

👍3

Todos 9 comentários

O guia de estilo já diz:

"Observação: ao trabalhar com bases de código maiores, usar um nome mais descritivo pode ajudar a aliviar a sobrecarga cognitiva e a capacidade de pesquisa. Evite nomes excessivamente prolixos que são difíceis de digitar."

Então eu acho que @johnpapa tem isso coberto bem. Talvez uma pequena melhoria seja mencionar que o uso de controladores aninhados conta como "bases de código maiores".

(No entanto ... se você estiver construindo com componentes bem isolados, provavelmente terá poucos controladores aninhados explicitamente, mesmo em grandes projetos.)

kylecordes em 5 nov. 2015

Essa seção do guia de estilo é bastante nova e provavelmente poderia ser expandida / melhorada um pouco IMO.
Veja esta conversa para mais informações: https://github.com/johnpapa/angular-styleguide/issues/462

zachlysobey em 5 nov. 2015

Sinta-se à vontade para fazer um PR para adicionar um pouco sobre os controladores de aninhamento, se você acha que vai ajudar

johnpapa em 15 nov. 2015

Eu sou um pouco novo no Angular e acabei de fazer a transição do Angular 1.4.8 para 1.5.0. Eu tive o mesmo problema, ao aninhar uma diretiva. A diretiva pai seria a propriedade controllerAs já que 'vm' foi substituída pela diretiva filho. adicionar um escopo isolado ao filho corrigiu o problema para mim, mas posso ver onde isso pode causar um problema.

josefromsanjose em 6 mar. 2016

Sinta-se à vontade para fazer um PR para adicionar um pouco sobre os controladores de aninhamento, se você acha que vai ajudar

johnpapa em 5 set. 2016

Em minha experiência com a nomeação de controladores Angular 1, entre as opções disponíveis, faz mais sentido renomeá-los de acordo com o próprio componente. Isso só falharia com o aninhamento do mesmo tipo de componente dentro de um tipo, o que na experiência com um aplicativo grande não ocorre com frequência.

karlhorky em 5 set. 2016

Portanto, para esclarecer, sugiro alterar essa regra no guia de estilo para recomendar o uso do nome do componente.

karlhorky em 5 set. 2016

Use vm até que não esteja claro. Em seguida, use um nome mais descritivo.
É isso que eu gosto.

johnpapa em 5 set. 2016

👍3

Tive o mesmo problema que jusefb relatou em novembro de 2015. Tínhamos mudado algumas diretivas para ser controllerAs: 'vm'. Em um caso, um controllerAs: 'vm' não tinha um escopo isolado (mas em todos os outros casos as diretivas controllerAs: 'vm' tinham um escopo isolado). Adicionando escopo: {}, a um controlador As: diretiva 'vm' que não tinha um escopo isolado corrigiu o problema.