我的代码中有一些html元素,稍后会在页面上添加。但是当你稍后添加它时,指令ng-click不起作用。
我尝试的另一个解决方案是使用onclick属性在此后添加的元素上调用节点方法,但这意味着在控制器外部调用angularJs方法并且它是不可能的(如果是这样,对于许多类型来说可能是一个很好的解决方案问题)
这是jsfiddle示例: http://jsfiddle.net/hugoofab/wktqrhv3/1/
这是标记:
<div ng-app="myApp" ng-controller="MyController" >
<button type="button" ng-click="testFunction('this will work')">STEP 1. this will work</button>
<button type="button" ng-click="addElement()" >STEP 2. add button</button>
<div id="foodiv"></div>
<button type="button" onclick="anotherWay()" >STEP 4. another way</button>
这是javascript:
var myApp = angular.module('myApp', []);
function anotherWay ( ) {
alert("another way would be call node method outside, but how to do it?")
// ohhh man.. what I'll code here?
//myApp.controller.scope()..... I really don't know
}
myApp.controller('MyController', function($scope) {
$scope.testFunction = function ( a ) {
alert(a)
}
$scope.addElement = function ( ) {
document.getElementById('foodiv').innerHTML = '<button type="button" ng-click="testFunction(\'this will not work\')">STEP 3. this will not work</button>' ;
}
});
感谢的!
答案 0 :(得分:0)
看来你正在以“非角度”的方式做事......
首先,这种情况发生在您身上,因为您在角度为$compile
视图后添加了这些元素。
这种“角度方式”的一种方法是在按钮上使用ng-show
/ ng-hide
指令,并使用控制器显示/隐藏它们。
另一种方式是这样的事情:
$scope.buttons = [{ }, { }];
使用控制器向此阵列添加按钮。然后使用ng-repeat
在视图中渲染此数组。