调用函数或将数据传递到另一个控制器AngularJS

debugcn 发表于 Dev

马修斯·赫尔南德斯（Matheus Hernandes）

我似乎已经遇到过此类问题的其他话题，但是没有人可以帮助我...所以这是我的问题：

我有一个带有搜索按钮的导航栏，此按钮向Web服务发出请求并从中获取请求，并返回一个json对象，该对象必须用于填充表格列表。问题是，我的按钮和表位于单独的控制器中，并且确实按预期运行。

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

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

我该怎么做？

感谢大家

巴尔加夫·波纳帕利（Bhargav Ponnapalli）

设置变量时，请使用$ rootScope。$ emit发出更改事件，并使用$ on在lista控制器中获取值。我在这里使用customListAr只是为了演示按钮单击。这有帮助吗？

var app = angular.module('clientRest', [])
  .controller('lista', ['$scope', 'loadLista', '$rootScope',
    function($scope, loadLista, $rootScope) {
      console.log(loadLista);
      $scope.contatos = loadLista.getContatos();
      $rootScope.$on('change', function() {
        $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);
        });

      };

      $scope.customListAr = function() {
        loadLista.setContatos(["item 1" , "item 2", "item 3"]);
      }
    }
  ])
  .service('loadLista', ['$rootScope',
    function($rootScope) {
      var contatos = [];
      return {
        getContatos: function() {
          return contatos;
        },
        setContatos: function(c) {
          contatos = c;
          $rootScope.$emit('change');
        }
      };
    }
  ]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="clientRest">
  <div ng-controller="lista">
    <ul>
      <li ng-repeat="a in contatos">{{a}}</li>
    </ul>
  </div>
  <div ng-controller="pesquisa">
    <button ng-click="customListAr()">Click Me</button>
  </div>
</div>

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。