Angular.js 1.4 – Como adicionar uma directive dentro de outra directive – Drall Dev Community
app.controller('DrallCtrl', function($scope) {
$scope.numbers=[0,1,2,3,4,5,6];
app.directive('drallRepeat', function($compile){
//Prioridade mais alta significa executar primeiro
//Impede a compilação de qualquer outra directive no primeiro pass
//Vamos aqui adicionar ng-repeat ao dom
attrs.$set('ngRepeat', attrs.myRepeat);
//Acima, foi adicionado a directive ng-repeat ao elemento.
//Será ignorado durante a compilação directives com prioridades 5000 ou inferiores para evitar
//recursões infintas e da mesma forma, não é desejado se compilar novamente
var compiled =  $compile(element, null, 5000);
//Quando na fase de linking, apenas delega para a função de link o retorno da compilação
<body ng-controller="DrallCtrl">
Esta lista foi gerada por um "drall-repeat" directive que via programação adicionou um "ng-repeat" ao elemento li.
<li drall-repeat="numero in numeros">{{numero}}</li>
Neste caso, este é apenas um simples uso da técnica para ilustrar como você poderia fazr.
É transformado uma directive "drall-repeat", adicionando uma directive 'ng-repeat' de forma dinâmica com a mesma expressão. É possível modificar este exemplo para atender às suas necessidades, adicionando diferentes atributos a directive, dependendo dos valores de determinadas condições.
O código acima tem os seguintes benefícios:
Nada é recompilados.
Simplesmente é feito uma pausa compilação, altera-se o dom e, em seguida, continua-se de onde parou.
Nenhuma manipulação louca ou clonagem de dom
Há pessoas que tentam estas técnicas, usam funções de clones ou coisas estranhas como transclude. O dom aqui é intocável (exceto se adicionar atributos a ele)
Atributo da directive original permanecem no dom.
Adicionar smartTable.table no sistema Inserindo elemento condicionalmente no angularjs (ng-if) VueJS – Comportamento atual da versão 1.0.21 e anteriores sobre atributos extras em Directive jQuery like Angular.js directive Como obter e criar módulos em Angular.js 1.x Angular.js – Versão 1.4 lançada Alterações de funcionamento entre o ng-options do Angular 1.3 e 1.4 Primeira impressão de desenvolvimento de aplicativos usando Angular.js 2.0 Processo típico de migração do Angular 1 para o Angular 2
This entry was posted in AngularJS and tagged angularjs, javascript, programação by Alvarenga Milton. Bookmark the permalink.