javascript - 调用函数或将数据传递给另一个 Controller AngularJS

Question

我已经有类似问题的其他主题，但没有人能帮助我...所以这是我的问题:

我有一个带搜索按钮的导航栏，这个按钮从网络服务发出和获取请求并返回一个 json 对象，该对象必须应用于填充表格列表。问题是，我的按钮和我的表格在不同的 Controller 中，它确实像我预期的那样工作。

var app = angular.module('clientRest', []).controller('lista', ['$scope', 'loadLista', function($scope, loadLista) {
    $scope.contatos = loadLista.getContatos();
}]).controller('pesquisa', ['$scope', '$http', 'loadLista', function($scope, $http, loadLista) {
    $scope.listar = function() {
        $http.get("http://localhost/wsRest/index.php/contato").success(function(response) {
            loadLista.setContatos(response);
        });
    };
}]).service('loadLista', function() {
    var contatos = [];
    return {
        getContatos: function() {
            return contatos;
        },
        setContatos: function(c) {
            contatos = c;
        }
    };
});

我的代码...当我从 pesquisa Controller 调用 listar() 时，我需要将接收到的数据从 lista Controller 发送到 $scope.contatos 以使我的 ng-repeat 工作，只需单击一下即可。

我该怎么做？

谢谢大家

Answer 1

最好使用服务在两个 Controller /模块之间共享数据，因为这可能是最好的方法。您可以引用下面给出的代码段来理解这个概念。

angular.module('app.A', [])
.service('ServiceA', function() {
    this.getValue = function() {
        return this.myValue;
    };

    this.setValue = function(newValue) {
        this.myValue = newValue;
    }
});

angular.module('app.B', ['app.A'])
.service('ServiceB', function(ServiceA) {
    this.getValue = function() {
        return ServiceA.getValue();
    };

    this.setValue = function() {
        ServiceA.setValue('New value');
    }
});

为了触发数据接收事件，您可以使用

1. 广播/发出消息 - 使用 @broadcast/@emit
2. 有回电的 Angular promise

3. Controller 启动函数重新加载先前从服务读取的信息

   .controller('MyController', function($scope, ServiceA) {
$scope.init = function() {
$scope.myValue = ServiceA.getValue();
};
//在Controller实例化时调用初始化函数
$scope.init();
});