我想让两个指令进行通信。我有两个指令:一个是表指令,另一个是头指令。 在标题上,我有两个按钮“添加”和删除。我想在点击添加按钮时在列表中添加一个元素,并在用户点击删除按钮时删除该元素。
但是列表是一个不同的指令,如何在删除和添加操作后更新数组?
Here是我的代码。
40
/ \
35 50
/ \ / \
34 36 45 55
/\
44 46
点击添加按钮时,我需要用户在列表中按下默认值.directive('tm',function(){
return {
restrict: 'E',
templateUrl: 'login.html',
scope: {
},
controller: 'f',
controllerAs: 'vm'
};
})
.controller('f',function($http, $scope){
var vm = this;
$http.get('data.json').success(function(data){
vm.data = data;
})
})
.controller('abc',function($http, $scope){
})
.directive('h',function(){
return {
restrict: 'E',
templateUrl: 'header.html',
scope: {
},
controller: 'he',
controllerAs: 'h'
};
})
.controller('he',function($http, $scope){
var h =this;
h.add=function(){
alert('heelo')
}
h.delete=function(){
alert('delete')
}
})
,并且应该更新列表。当用户单击“删除”时,它会删除最后一个元素并更新列表。
更新plunker服务器未运行
我做小提琴 https://jsfiddle.net/8fjhLqnw/
我需要在按下添加按钮时在列表中添加项目...并在按下删除按钮时删除项目
答案 0 :(得分:3)
首先创建服务以共享数据和函数,如下所示:
service('sharedData', function(){
var vm = this;
vm.list = [];
vm.add=function(item){
vm.list.push(item);
}
vm.get = function(){
$http.get('data.json').success(function(data){
vm.data = data;
})
}
vm.delete=function(item){
// use slice for delete object from list
}
})
然后你必须在你的指令中注入这个服务:
controller('he', function($http, $scope, sharedData)
并在您的函数中使用sharedData
:
h.add=function(item){
sharedData.add(item)
}