ng-click无法在动态创建的内容中使用

时间:2015-05-26 21:03:18

标签: javascript angularjs angularjs-scope

我在Angular中有这个功能,我在其中添加一个带有ng-click的新幻灯片。

var addSlide = function($scope, slideIndex, $event) {
  slideIndex++;
  var slider = angular.element('.slick-slider');
  var currentSlide = slider.slick('slickCurrentSlide');
  slider.slick('slickAdd', '<div class="slide" ng-click="addPhoto(); $event.stopPropagation();"><input type="file" class="camera-trigger" accept="image/*"><img class="photo-img" src="" /></div>');
};

不幸的是,动态创建的ng-click事件不起作用(ng-click not working from dynamically generated HTML),我怎么能在我的情况下解决这个问题,因为它在控制器内部而不是指令?< / p>

1 个答案:

答案 0 :(得分:19)

你需要在这里添加$ compile服务,它会将像ng-click这样的angular指令绑定到你的控制器范围。如:

var divTemplate = '..your div template';
var temp = $compile(divTemplate)($scope); 

然后将其附加到HTML:

angular.element(document.getElementById('foo')).append(temp);

您还可以将事件绑定到div,如下所示:

 var div = angular.element("divID");
 div.bind('click', $scope.addPhoto());