scope - angularjs:从外部范围访问内部范围

Question

我正在尝试从 angularjs 应用程序中的子 Controller 中的父 Controller 移动位，以免过多地污染主 Controller 。
这是一个简化的 fiddle :http://jsfiddle.net/terebentina/5RMPV/
因此，当我单击更改按钮时，第三个字母应更改为“X”。
最初 item_change() 函数在主 Controller 内部并且正在执行 $scope.items[idx] = 'X'这工作得很好。但是，由于我将它移到了 ItemCtrl 中，所以我不知道如何为第三个元素访问它。

任何帮助将非常感激。

Answer 1

将内容移出主 Controller 的一种方法是在服务或工厂内的 Controller 之间共享和更改所有数据(在 this article 中有很好的描述)。

这是 updated fiddle .您只需要注入(inject) itemsService进入您想要访问项目数据的任何 Controller 。

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');
        }

    })