2012-09-07 109 views
4

我试图从angularjs应用程序中的子控制器内的父控制器中移动位,以免太多污染主控制器。 这里有一个简化小提琴:http://jsfiddle.net/terebentina/5RMPV/ 所以当我点击更改按钮时,第三个字母应该变成'X'。 最初item_change()函数是在主控制器内部,并且正在做$scope.items[idx] = 'X',这工作得很好。但是,由于我将它移动到ItemCtrl中,所以我不知道如何访问第三个元素。angularjs:从外部范围访问内部示波器

任何帮助将不胜感激。

+0

对于简单的数据建模,模型数据与单个控制器(可以通过$范围)相关,与行为/该模型的方法是该单个控制器上的功能。当你需要更复杂的东西时 - 例如多个控制器需要访问相同的数据/模型 - 你可以使用$ scope。$ emit events和$ scope。$来监听事件,或者(更好的方法) Gloopy显示:将模型的数据(和行为/功能)放入一个服务中,然后通过注入使控制器访问。 –

+0

我最初是想让项目真正的js对象都有item_change()方法,所以我可以调用$ scope.items [3] .item_change(),但它可能是矫枉过正。我现在要和Gloopy的建议一起去。谢谢 –

回答

6

将事情从主控制器中移出的一种方法是共享并更改服务器或工厂内的控制器之间的数据(在this article中描述得非常好)。

这是updated fiddle。你只需要在itemsService注入到任何控制器,你将要访问的项目数据。

angular.module('test', []) 
    .service('itemsService', function(){ 
     var items = ['A', 'B', 'C', 'D']; 

     return{ 
      getItems: function(){ 
       return items; 
      }, 
      changeItem: function(index, value){ 
       items[index] = value; 
      } 
     } 
    }) 
    .controller('MainCtrl', function($scope, itemsService) { 
     $scope.items = itemsService.getItems();  

     $scope.change = function(idx) { 
      itemsService.changeItem(idx, 'X'); 
     } 

    }) 
+0

哦......有道理。仍围绕着“有角度的方式”。谢谢 –