Question

我有两个控制器。我想使用服务将变量从一个控制器更新到另一个控制器但不更新。

我希望变量$scope.names在控制器中选择＆＃39;更新控制器＆＃39;当前＆＃39;并显示它

app.controller('select', ['$scope', '$http', 'myService', function($scope,$http, myService) {
$http.get('/myapp/stocknames'). 
success(function(data) {
    $scope.names=data;
    myService.names=data;
});
}]);

我正在使用myService在两个控制器之间交换数据。我已经在我的服务中声明了。

app.service('myService', function($http, $rootScope) { this.names=[] });

app.controller('current', ['$scope', '$http', 'myService', function($scope,$http, myService) {
$scope.names=myService.names;
console.log($scope.names);  
}]);

你能帮忙吗？一旦选择控制器中的$scope.names变量更新，我该如何让当前控制器更新数据？

据我所知，我在做什么应该工作： - /

Answer 1

有很多方法可以存档：

第一：通过观察服务变量数据更改

var app = angular.module('plunker', []);

app.service('dataService', function() {
  this.serviceData = "test";
});

app.controller('MainCtrl', function($scope, dataService) {
  $scope.mainClickHandler = function(mainData) {
    dataService.serviceData = mainData;
  }
});


app.controller('SubCtrl', function($scope, dataService) {
  $scope.name = 'World';

  $scope.getServiceData = function() {
    return dataService.serviceData;
  }

  $scope.$watch("getServiceData()", function(newValue, oldValue) {
    if (oldValue != newValue) {
      $scope.name = newValue;
    }
  });
});

http://plnkr.co/edit/G1C81qvDD179NILMMxWb

第二

使用事件广播

var app = angular.module('plunker', []);

app.factory('dataService', function($rootScope) {
  var serviceData = {
    "mydata": "test"
  };

  $rootScope.$watch(function() {
    return serviceData.mydata;
  }, function(newValue, oldValue, scope) {
    $rootScope.$broadcast('dataService:keyChanged', newValue);
  }, true);

  return serviceData;

});

app.controller('MainCtrl', function($scope, dataService) {
  $scope.mainClickHandler = function(mainData) {
    dataService.mydata = mainData;
  }
});


app.controller('SubCtrl', function($scope, $rootScope, dataService) {
  $scope.name = 'World';

  $rootScope.$on('dataService:keyChanged', function currentCityChanged(event, value) {
    console.log('data changed', event, value);
    $scope.name = value;
  });

});

http://plnkr.co/edit/tLsejetcySSyWMukr89u?p=preview

第三

使用回调

var app = angular.module('plunker', []);

app.service('dataService', function() {
  var serviceData = "test";
  var callback = null;
  this.updateServiceData = function(newData){
    serviceData = newData;
    if(null!==callback)
    {
      callback();
    }
  };

  this.getServiceData = function(){
    return serviceData;
  };

  this.regCallback = function(dataCallback){
    callback = dataCallback;
  };
});

app.controller('MainCtrl', function($scope, dataService) {
  $scope.mainClickHandler = function(mainData) {
    dataService.updateServiceData(mainData);
  }
});


app.controller('SubCtrl', function($scope, dataService) {
  $scope.name = 'World';
  $scope.dataChangeCalback = function() {
    $scope.name = dataService.getServiceData();
  }
  dataService.regCallback($scope.dataChangeCalback);
});

http://plnkr.co/edit/vrJM1hqD8KwDCf4NkzJX?p=preview

Answer 2

这样做的一种方法是我们可以将整个服务绑定到范围：

npm install -g phonegap@latest

然后我们直接更改myService.names

当前控制器应如下所示：

myApp.controller('select', ['$scope', '$http', 'myService', function($scope,$http, myService) {
          $scope.myService = myService;
          $scope.click = function () {
              myService.names = "john";
        };

然后我们使用观察者表达式。

或watcherExpression请参阅for more details.

在http.get之后，从另一个控制器更新一个控制器中的变量值？

2 个答案: