AngularJs bind controller после ссылки добавляет новый элемент

Question

У меня есть директива, как показано ниже, в основном добавьте новый элемент с текущим. и новый элемент связывания нг-контроллера «openCntl»

explorerModule.controller("openCntl",function($scope, $dialog){ 
    $scope.open = function(){   
     alert('dialog closed with result: ' + result); 
    }; 
}); 



explorerModule.directive('ngCustomerClick', function($parse){ 
    return { 
     controller : "openCntl", 

     link: function(scope, element, attr){ 
      var alert = angular.element(
       '<div class="lp-dropdown-wrapper open" ng-controller="dialogCntl" ' + 
       '><div class="arrow"></div>' + 
       '<ul class="nav nav-tabs" style="display: inline;">' + 
       '<li class="add" ng-click="open()"><a tabindex="-1" href="#"><span class="icon-coffee"></span>Add</a></li>'+ 
       '</ul></div>' 
      ); 
     } 
    } 
}); 

, но когда я нажимаю Ли, не вызывать функцию в контроллере «openCntl», как достичь этого?

Большое спасибо

Answer 1

Вы должны использовать $compile, чтобы Угловое знать о новом элементе.

сердце раствора:

link : function(scope, el, attrs) { 
    var newElem = angular.element('<SomeNewElement/>'); 
    el.append(newElem); 
    $compile(newElem)(scope); 
} 

Смотрите эту plunker, который использует модифицированную версию кода: http://plnkr.co/edit/tOUl8CM56GSd0L3xdNQW?p=preview

Примечание: в вашем вопросе, вы, кажется, думают, что open из openCntl будет вызывается, но ваш новый элемент имеет свой собственный ng-controller со ссылкой на dialogCntl. В вашем вопросе openCntl является контроллером директивы, а не контроллером нового элемента. Я также исправил это в своем плунтере, предоставив dialogCntl.