Manipulação do DOM com jQuery
Programadores iniciantes em #AngularJS podem ocorrer nesta falha: tentar usar jQuery para modificar o DOM em controladores. Isso inclui adicionar elementos, remover elementos, recuperar seus conteúdos, mostrá-los e escondê-los. Use diretrizes embutidas, ou escreva seu próprio caso, para fazer sua manipulação DOM. Veja abaixo sobre a funcionalidade de duplicação.
Se você está lutando para quebrar o hábito, considere a possibilidade de remover jQuery do seu aplicativo. AngularJS tem o serviço $ http e as diretivas poderosas que tornam quase sempre desnecessário o uso do jQuery . O jQLite incluído na AngularJS possui alguns dos recursos mais utilizados na escrita de diretivas AngularJS, especialmente vinculativas para eventos.
Tentando duplicar a funcionalidade que já existe
Avalie antes de tentar implementar uma funcionalidade: há uma boa chance de que seu aplicativo não seja o primeiro a exigir certas funcionalidades. Alguns exemplos a seguir.
Ng-repeat
Com Ng-repeat acontece muito. Programadores tentam usar o jQuery para adicionar mais elementos em vez de utilizar da ng-repeat.
Ng-show
Com Ng-show também ocorre frequentemente. Programadores estão acostumados a exibir e ocultar elementosusando o jQuery, pois é assim que o fazem em outros aplicativos e esquecem que o AngularJS disponibiliza esta facilidade. Ng-show (e ng-hide) condicionalmente mostram e escondem elementos com base em expressões booleanas.
Para exibir e ocultar um elemento, basta descrever as condições nas variáveis $scope
<div ng-show="!loggedIn"><a href="#/login">Click here to log in</a></div>ng-class
A aplicação condicional de classes a elementos é outra tarefa qual programadores estão acostumados a utilizar jQuery. No AngularJS você pode fazer de uma maneira mais fácil: basta nomear a ng-class com um conjunto de nomes de classes separados por espaços.
Uma ainda solução mais "elegante" seria usar seguinte sintaxe:
<div ng-class="{ errorClass: isError, warningClass: isWarning, okClass: !isError && !isWarning }">...</div>Onde você atribui a ng-class um objeto, cujas chaves são nomes de classes #CSS e cujos valores são expressões condicionais usando variáveis $ scope. O elemento terá então todas as classes cujas condições são verdadeiras, e nenhum daqueles cujas condições são falsas.
Observe também a classe prática ng-class-even e ng-class, e o relacionado com algo diferente do estilo ng.
Divisão por Módulos
Sobrecarregar o Controlador
Combinando ng-repeat com outras diretivas
O ng-repeat é extremamente útil, uma das diretivas mais poderosas da AngularJS. No entanto, a transformação que se aplica ao DOM é substancial. Portanto, aplicar outras diretivas (como ng-show, ng-controller e outros) para o mesmo elemento que ng-repeat pode causar problemas.
Se você deseja aplicar uma diretiva a toda a repetição, envolva a repetição em um elemento pai e coloque-a lá. Se você deseja aplicar uma diretiva a cada parte interna da repetição, coloque-a em um filho do elemento com ng-repeat.
