I have this function in Angular where I add a new slide with a ng-click in it.
我在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>');};Unfortunately dynamically created ng-click events don't work (ng-click not working from dynamically generated HTML), how can I fix this in my case, since it's a function inside a controller, instead of a directive?
不幸的是,动态创建的ng-click事件不起作用(ng-click不能动态生成HTML),我怎么能在我的情况下解决这个问题,因为它是控制器内的一个函数,而不是指令?
1 个解决方案
#1
19
you need to add $compile service here, that will bind the angular directives like ng-click to your controller scope.Something like:
你需要在这里添加$ compile服务,它会将像ng-click这样的angular指令绑定到你的控制器范围。如下所示:
var divTemplate = '..your div template';var temp = $compile(divTemplate)($scope); Then append it to the HTML:
然后将其附加到HTML:
angular.element(document.getElementById('foo')).append(temp);You can also bind the event to the div as following:
您还可以将事件绑定到div,如下所示:
var div = angular.element("divID"); div.bind('click', $scope.addPhoto());#1
19
you need to add $compile service here, that will bind the angular directives like ng-click to your controller scope.Something like:
你需要在这里添加$ compile服务,它会将像ng-click这样的angular指令绑定到你的控制器范围。如下所示:
var divTemplate = '..your div template';var temp = $compile(divTemplate)($scope); Then append it to the HTML:
然后将其附加到HTML:
angular.element(document.getElementById('foo')).append(temp);You can also bind the event to the div as following:
您还可以将事件绑定到div,如下所示:
var div = angular.element("divID"); div.bind('click', $scope.addPhoto());