Question

我有一个AngularJS应用程序（1.4.10），我需要在两个控制器之间共享一些数据。

所以我做了我的工厂：

.factory('CardsForService', function($http, URL){
    var service = {
        "block_id": '',
        "service_id": ''
    };

    service.save_data = function(block_id, service_id){
        service.block_id = block_id;
        service.service_id = service_id;
    };

    service.get_data = function(){
        return service;
    };

    return service;
})

我在第一个控制器中插入数据：

$scope.open = function(id, type){
    console.log(id +" "+type);
    CardsForService.save_data(id, type);
    ...

我尝试将数据放在另一个控制器中，如下所示：

$scope.$on('$routeChangeSuccess', function() {
    if  (algo_to_used == "service"){
        var data = CardsForService.get_data();
        console.log(data);
    } else {
    }
});

console.log输出：

Object {block_id: "", service_id: ""}

如果我在调用save_data（）函数的同一个控制器中尝试相同的get_data（）函数，我会得到正确的结果。

我错过了什么？

Answer 1

像这样改变工厂

app.factory('CardsForService', function(){
var service = {
    "block_id": '',
    "service_id": ''
};

var save_data = function(block_id, service_id){
    service.block_id = block_id;
    service.service_id = service_id;
};

var get_data = function(){
    return service;
};

return{
   saveData:save_data,
   getData:get_data
}});

在控制器中

app.controller('FirstCtrl',function(CardsForService){
    CardsForService.setData(id, type);
});

app.controller('SecondCtrl', function($scope, CardsForService){
    $scope.data = CardsForService.getData();
});

Answer 2

听起来这可能是一个时间问题。来自此类服务的数据不具有反应性。这是一个应该帮助可视化它的片段。

＆＃13;

var app = angular.module("demo", []);

app.factory("MySvc", function() {
  var data = {};
  data.setData = function(key, value) {
    this[key] = value;
  }
  data.getData = function(key, def) {
    return key in this ? this[key] : def;
  };
  return data;
});

app.controller("test1", ["$scope", "MySvc", "$timeout",
  function($scope, MySvc, $timeout) {
    $timeout(100).then(function() {
      MySvc.setData("foo", "bar");
      $scope.data = MySvc.getData("foo");
    });
  }
]);

app.controller("test2", ["$scope", "MySvc", "$timeout",
  function($scope, MySvc, $timeout) {
    $timeout(500).then(function() {
      $scope.data = MySvc.getData("foo", "baz");
    });
  }
]);

app.controller("test3", ["$scope", "MySvc",
  function($scope, MySvc) {
    $scope.data = MySvc.getData("foo", "asdf");
  }
]);

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js "></script>

<div ng-app="demo">
  <pre ng-controller="test1">Test 1: {{ data }}</pre>
  <pre ng-controller="test2">Test 2: {{ data }}</pre>
  <pre ng-controller="test3">Test 3: {{ data }}</pre>
</div>

＆＃13;

Answer 3

好的我解决了这个问题。基本上在我使用此代码重定向到新页面之前：

footer

现在我切换到这段代码：

$window.location.assign('/cards/service');

它正在工作。

唯一的一点是，当我重定向页面时，当Chrome重定向中的控制台刷新每次重新加载时，它都不起作用，现在控制台不会刷新。有人能告诉我这两个功能之间的区别吗？

AngularJS工厂用于在控制器之间共享数据

3 个答案: