我有一個指令(顯示YouTube視頻),它應該把一個函數作爲一個屬性,以便能夠在鏈接函數中啓動它。將一個函數傳遞給一個指令,然後用參數調用它
我(玉)
div(ng-controller="videoPageCtrl")
...
div(my-youtube,id='aaa',url='KEHxHr-Ih9w',on-change="doEventsOnChange")
我的控制和指導的樣子寫的HTML中如下
app
.directive('myYoutube', function($sce, $timeout) {
return {
restrict: 'A',
scope: {
url: '@',
id: '@',
onChange: '&',
},
link: function(scope) {
$timeout(function() {
scope.player = new YT.Player(scope.id, {
videoId: scope.url,
events: {
'onStateChange': function(state) {
console.log('state changed to', state, scope.id, scope.onChange);
scope.onChange(state, scope.id);
}
}
});
}, 5000);
}
};
})
.controller('videoPageCtrl', ['$scope', '$http', '$sce', function($scope, $http, $sce) {
$scope.doEventsOnChange = function(state, id) {
console.log(id, state, 'launched from controller!');
};
}]);
的問題是,我無法通過id
和state
和火起來的doEventsOnChange
功能。 結果在chrome dev控制檯中,我只能看到state changed to
行,但沒有launched from controller!
行通過id
和state
。
我在做什麼錯?
因此,如果我的指令中有模板,我應該使用'&'? – kaytrance
如果您的指令中有一個模板,並且您想從中調用該模板,那麼可以在這裏指出一個ng-click,是的。如果您只是想在指令的控制器中使用它,請使用'=' –
@MartijnWelker ..通過爲指令創建一個隔離範圍,範圍不一樣。所以指令和控制器沒有使用相同的範圍。通過使用「=」,您只需將父作用域的函數(模型)綁定到子作用域的模型:)。它當然會起作用,但我認爲並且會更合適。這是因爲對於永遠不會改變的函數(在控制器或指令中)的兩種方式綁定不是很合適。使用和引用該函數是一個更好的選擇。 – AhsanAyaz