Question

我构建了一个工厂来从数据库中获取数据并传递给我的应用程序中的所有控制器，如下所示：

(function () {
    angular.module('appContacts')
        .factory('dataService', ['$http', dataService]);

    function dataService($http) {

        return {
            getCurrentOrganization: getCurrentOrganization,
        };

        function getCurrentOrganization(id) {

            return $http({
                method: 'GET',
                url: '/api/organization/' + id + '/contacts'
            })
        }
    }

})();

我有这样的观点：

<div ng-app="myapp">
  <div ng-controller="contactController">
     <a ui-sref="organization({Id: organization.id})" ng-click="vm.setCurrentOrganization(organization)"> {{organization.organizationName }}</a>
 </div>
</div>

该链接从视图contactsView.html重定向到由第二个控制器管理的详细视图organizationDetail.html：

  ....
.state("home", {
        url: "/",
        templateUrl: "views/contactsView.html",
        controller: "contactsController",
         controllerAs: "vm"
    })
    .state("organization", {
        url: "/organization/:Id",
        templateUrl: "views/organizationDetail.html",
        params: { Id: null },
        controller: "organizationsController",
        controllerAs: "vm"
    })
...

我的问题是，我在控制台中看到了数据，但是当新网址到位时，数据消失了，视图显示为空。

如何在第二个控制器中使用工厂生成的数据？

编辑：

以下是控制器：

//organizationsController.js
(function () {
    "use strict";
    angular.module('appContacts')
        .controller('organizationsController', function organizationsController(dataService) {

            var vm = this;

            vm.setCurrentOrganization = function (organization) {
                vm.theOrganization = organization;
                vm.visible = true;

  dataService.getCurrentOrganization(vm.theOrganization.id).then(function (result) {
                    vm.organizationData = result.data;

                }, function () {
                    vm.errorMessage = "Failed to load" + Error;
                });
            }
    });
})();

和contactsController：

//contactsController.js

(function () {
    "use strict";
    angular.module('appContacts')
        .controller('contactsController', function contactsController(dataService) {

            var vm = this;
            vm.visible = false;

            activate();

            function activate() {
                dataService.getAllContacts().then(function (result) {
                    vm.allcontacts = result.data;
                }, function () {
                    vm.errorMessage = "Failed to load" + Error;
                });

                dataService.getAllOrganizations().then(function (result) {
                    vm.organizations = result.data;
                }, function () {
                    vm.errorMessage = "Failed to load" + Error;
                });
            }
    });
})();

问题是我单击视图A中的llink（contactsView.html / ContactsViewController），我应该使用服务中的数据提取结束VIEW B（OrganizationDetails.html / organizationController）。

Answer 1

你这里做错了

<div ng-app="myapp">
  <div ng-controller="contactController">
     <a ui-sref="organization({Id: organization.id})" ng-click="vm.setCurrentOrganization(organization)"> {{organization.organizationName }}</a>
  </div>
</div>

您的contactController没有setCurrentOrganization功能。相反，它在另一个控制器。您可以从HTML中删除代码ng-click="vm.setCurrentOrganization(organization)"。并使用id中的$stateParams阅读organizationsController。获得id后，使用它调用以下服务：

dataService.getCurrentOrganization(id).then(function (result) {
        vm.organizationData = result.data;
    }, function () {
      vm.errorMessage = "Failed to load" + Error;
});

为什么我的服务不在控制器之间共享数据？

1 个答案: