AngularJS - 不从服务功能更新的Controller变量

时间:2016-05-08 17:54:21

标签: javascript angularjs

我有这个变量由工厂控制并更新控制器,但它没有发生。

这就是我所拥有的:

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

app.controller('AppController', function($scope, AppFactory) {
  var vm = this;

  $scope.serverStatus = AppFactory.getStatus();
});

app.factory('AppFactory', function($timeout) {

  var AppFactory = {};
  var vm = this;
  vm.serverStatus = true;

  // Execute after 2 seconds of page start
  $timeout(function() {
    AppFactory.setStatus(false);
  }, 2000);

  AppFactory.setStatus = function(status) {
    console.log('Server set to ' + status);
    vm.serverStatus = status;

    // Getting server status = false
    AppFactory.getStatus();
  };


  AppFactory.getStatus = function() {
    console.log('Getting server status: ' + vm.serverStatus);
    return vm.serverStatus;
  };

  return AppFactory;
});

LIVE PLUNKER DEMO:https://plnkr.co/edit/62xGw7Klvbywp9TODWF4?p=preview

您认为指令在工厂和控制器之间进行双向通信会更好吗?

2 个答案:

答案 0 :(得分:1)

检查此编辑的plunkr https://plnkr.co/edit/z6tdr5?p=preview

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

app.controller('AppController', function($scope,$timeout, AppFactory) {
  var vm = this;

  $timeout(function() {
    AppFactory.setStatus(false);
    $scope.serverStatus = AppFactory.getStatus();
  }, 2000);

  $scope.serverStatus = AppFactory.getStatus();
});

app.factory('AppFactory', function($timeout) {

  var AppFactory = {};

  var serverStatus = true;

  // Execute after 2 seconds of page start


  return {
        getStatus: function () {

          //console.log('Getting server status: ' + vm.serverStatus);
          return serverStatus;
        },
        setStatus : function(status) {
          var vm = this;
        console.log('Server set to ' + status);
        serverStatus = status;

        // Getting server status = false
        vm.getStatus();
  }
  };
});

答案 1 :(得分:0)

这是一个使用事件的解决方案,例如:

app.controller('AppController', function($scope, AppFactory) {
  var vm = this; 

  $scope.$on('messageOne', function(event, data){
    console.log(data);
      $scope.serverStatus = data;
      $scope.$apply(); //I think $apply() is not needed here!
  });

  $scope.serverStatus = AppFactory.getStatus();


});

app.factory('AppFactory', function($timeout, $rootScope) {

  var AppFactory = {};
  var vm = this;
  vm.serverStatus = true;

  // Execute after 2 seconds of page start
  $timeout(function() {
    AppFactory.setStatus(false);
  }, 2000);

  AppFactory.setStatus = function(status) {
    console.log('Server set to ' + status);
    vm.serverStatus = status;

    // Getting server status = false
    //AppFactory.getStatus();

    $rootScope.$broadcast('messageOne', status);
  };


  AppFactory.getStatus = function() {
    console.log('Getting server status: ' + vm.serverStatus);
    return vm.serverStatus;
  };

  return AppFactory;
});

https://plnkr.co/edit/pARMnE3Wl0OeJezKuvLT?p=info