我有一個angularJS示例<div ng-controller="testCtrl"><test color1="color1" updateFn="updateFn()"></test></div> <script> angular.module('dr', []).controller("testCtrl", function($scope) { $scope.color1 = "color"; $scope.updateFn = function() { alert('123'); }}).directive('test', function() { return { restrict: 'E', scope: {color1: '=', updateFn: '&'}, template: "<button ng-click='updateFn()'>Click</button>", replace: true, link: function(scope, elm, attrs) { } }});</script></body></html>我想要當我單擊按鈕時，將出現(xiàn)警報框，但什么也沒顯示。誰能幫我？
3 回答
達令說
TA貢獻1821條經(jīng)驗 獲得超6個贊
要從隔離作用域指令內(nèi)部在父作用域中調(diào)用控制器功能，請dash-separated在HTML中使用屬性名稱，如OP所述。
另外，如果要向函數(shù)發(fā)送參數(shù)，請通過傳遞對象來調(diào)用函數(shù)：
<test color1="color1" update-fn="updateFn(msg)"></test>
JS
var app = angular.module('dr', []);
app.controller("testCtrl", function($scope) {
$scope.color1 = "color";
$scope.updateFn = function(msg) {
alert(msg);
}
});
app.directive('test', function() {
return {
restrict: 'E',
scope: {
color1: '=',
updateFn: '&'
},
// object is passed while making the call
template: "<button ng-click='updateFn({msg : \"Hello World!\"})'>
Click</button>",
replace: true,
link: function(scope, elm, attrs) {
}
}
});
largeQ
TA貢獻2039條經(jīng)驗 獲得超8個贊
在“測試”指令Html標記中，函數(shù)的屬性名稱不應為駝峰式，而應基于破折號。
所以-代替：
<test color1="color1" updateFn="updateFn()"></test>
寫：
<test color1="color1" update-fn="updateFn()"></test>
這是angular區(qū)分指令屬性（例如update-fn函數(shù)）和函數(shù)之間差異的方法。
- 3 回答
- 0 關(guān)注
- 637 瀏覽
添加回答
舉報
0/150
提交
取消