如何在角度js中添加数组中的项目?

时间:2015-12-22 06:08:53

标签: javascript angularjs angularjs-directive angularjs-scope angularjs-ng-repeat

我想让两个指令进行通信。我有两个指令:一个是表指令,另一个是头指令。 在标题上,我有两个按钮“添加”删除。我想在点击添加按钮时在列表中添加一个元素,并在用户点击删除按钮时删除该元素。

但是列表是一个不同的指令,如何在删除和添加操作后更新数组?

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/

我需要在按下添加按钮时在列表中添加项目...并在按下删除按钮时删除项目

1 个答案:

答案 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)
}

Here is code