Será que o meu modelo ng realmente precisa ter um ponto para evitar problemas de escopo de $ criança?

De acordo com https://github.com/angular/angular.js/wiki/Understanding-Scopes , é um problema tentar vincular dados a primitivos anexados ao seu $scope :

A inheritance do escopo é normalmente direta, e você nem precisa saber o que está acontecendo … até tentar uma binding de dados bidirecional (isto é, elementos de formulário, ng-model) para uma primitiva (por exemplo, número, string, booleano) definido no escopo pai de dentro do escopo filho. Não funciona da maneira que a maioria das pessoas espera que funcione.

A recomendação é

Esse problema com primitivos pode ser facilmente evitado seguindo a “melhor prática” de sempre ter um ‘.’ nos seus ng-modelos


Agora, eu tenho essa configuração muito simples que viola essas regras:

HTML:

   

JS:

 function MyController($scope) { $scope.theText = ""; $scope.shouldDisable = function () { return $scope.theText.length >= 2; }; } 

Isso é muito ruim? Isso vai me atrapalhar de alguma forma horrível quando eu começar a tentar usar escopos infantis, de alguma forma?


Eu preciso mudar isso para algo como

 function MyController($scope) { $scope.theText = { value: "" }; $scope.shouldDisable = function () { return $scope.theText.value.length >= 2; }; } 

e

   

para que eu siga as melhores práticas? Que exemplo concreto você pode me dar quando este último me salvará de alguma consequência horrível que estaria presente no primeiro?

Muitas coisas introduzem novos escopos. Digamos que em seus controladores, você realmente queira adicionar guias: a primeira guia é a renderização real, a segunda guia é o formulário (para que você tenha uma visualização em tempo real).

Você decide usar uma diretiva para isso:

   
{{theText|formatInSomeWay}}

Bem, sabe o que? tem seu próprio escopo e quebrou o seu controlador! Então, quando você edita, o angular fará algo assim em js:

 $scope.theText = element.val(); 

que não percorrerá a cadeia de protótipos para tentar definir o theText nos pais.

EDIT: só para ficar claro, eu estou usando apenas “guias” como um exemplo. Quando eu digo ” Muitas coisas introduzem um novo escopo”, quero dizer: ng-include, ng-view, ng-switch, ng-controlador (é claro), etc.

Então, isso pode não ser necessário a partir de agora , porque você ainda não tem escopos filho nessa visualização, mas não sabe se vai adicionar modelos filhos ou não, o que pode eventualmente modificar o próprio theText , causando o problema. Para provar seu design no futuro, sempre siga a regra, e você não terá nenhuma surpresa então;).

Digamos que você tenha escopos M, A e B, onde M é o pai de ambos, A e B.

Se um de (A, B) tentar escrever no escopo de M, ele funcionará apenas em tipos não primitivos . A razão para isso é que tipos não primitivos são passados ​​por referência .

Os tipos primitivos, por outro lado, não são, portanto, tentar gravar no theText no escopo de M criará uma nova propriedade do mesmo nome no escopo de A ou B, respectivamente, em vez de escrever para M. Se A e B dependerem disso propriedade, erros acontecerão, porque nenhum deles estaria ciente do que o outro está fazendo.