0

Я пытаюсь добавить директиву динамически внутри ngrepeat. Пожалуйста, обратитесь к следующей скрипку ссылке: Fiddle LinkСтранное поведение при динамическом добавлении директивы в ngrepeat

Код:

// Code goes here 
var app = angular.module('myApp',[]); 

// myDir Directive 
app.directive('myDir', function() { 
    var controller = ['$scope','$compile', function ($scope,$compile) { 

    $scope.names=[{id:'1',directive:'subDir1'},{id:'2',directive:'subDir2'}]; 

    $scope.loadDynamicDir = function(id, directive) { 
     var newScope = $scope.$new(true); 
     var html = $compile('<div class="' + directive + '"></div>')(newScope); 
     angular.element(document.getElementById('div' + id)).append(html); 
    } 
    }] 

    return { 
    controller:controller, 
    templateUrl:'myDirTemplate.html' 
    } 

}) 

// subDir1 Directive 
app.directive('subDir1', function() { 
    return { 
    restrict:'C', 
    template: 'subDir1' 
    } 
}); 

// subDir2 Directive 
app.directive('subDir2', function() { 
    return { 
    restrict:'C', 
    template: 'subDir2' 
    } 
}); 

Unfortunatley, каждая директива добавляется в 3 раза. Может ли кто-нибудь объяснить точное поведение?

+0

Добавление Более того, белый ru Я использую templateUrl в подзаголовках, это ошибка бросания. Ссылка на скрипт для этого же [здесь] (https://plnkr.co/edit/bu6GfqKVafLcxPc7UFO7?p=preview) – Teja

ответ

0

Это довольно просто. Каждая функция добавлена ​​в шаблон будет работать, по крайней мере в два раза $digest цикла проходит дважды - первый после изменения модели, а второй, чтобы проверить, если первый цикл изменил любую модель

поэтому ваша функция loadDynamicDir будет работать каждый раз, когда есть $digest и так вы добавите HTML каждый раз, когда он создает больше узлов

Я добавил кнопку на plunker показывающие поведение

https://plnkr.co/edit/4hpVDOPJm2BMzSwRcm5N?p=preview

<body ng-app="myApp"> 
    <my-dir></my-dir> 
    <button ng-click="$digest()">do digest</button> 
</body> 
+0

Спасибо, можете ли вы объяснить это поведение также - когда я использую templateUrl в подзаголовках, он бросает ошибка. [Fiddle Link] (https://plnkr.co/edit/bu6GfqKVafLcxPc7UFO7?p=preview) – Teja

+0

Это то же самое, бесконечный дайджест. Каждый раз, когда вы компилируете директиву, вы запускаете $ digest, и каждый раз, когда выполняется $ digest, он запускает функцию из шаблона и выполняет другую компиляцию и т. Д. Вечно (если в дайджесте не было предела) – maurycy

Смежные вопросы