Question

让我们假设以下HTML：

<div ng-app="myApp" ng-controller="myController">
  {{currentValue}}
  <div ng-controller="myInnerController">
    <button ng-click="toggleValue()">
      Click me
    </button>
  </div>
</div>

这是JS：

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

app.controller('myController', ['$scope', 'valueFactory', function($scope, valueFactory) {
    $scope.currentValue = valueFactory.getValue();
  }]);

app.controller('myInnerController', ['$scope', 'valueFactory', function($scope, valueFactory) {
  $scope.toggleValue = function() {
      valueFactory.toggleValue();
    };
}]);

app.factory('valueFactory', function() {
  var value = false;

  var service = {
    getValue: function() {
      return value;
    },
    toggleValue: function() {
      value = !value;
      console.log(value);
    }
  };

  return service;
});

目前，currentValue将始终显示false。每次点击我＆＃34;它都应该改变。按下按钮。

我尝试了一些内容，例如在内部控制器内部更新$scope.currentValue，向父控制器添加监视。我没有尝试过任何工作。

那么如何通过调用子控制器中的工厂来影响currentValue？

FIDDLE

Answer 1

您正在分配boolean类型值。

值类型不会保留任何绑定。

<强> function ，<强> object ，<强> array ，<强> date 是引用类型。

此类型分配将继续参考。

试试这个

JS

app.controller('myController', ['$scope', 'valueFactory', function($scope, valueFactory) {
  $scope.valueFactory = valueFactory;

}]);

HTML

{{valueFactory.getValue()}}

的 JSFIDDLE

Answer 2

到目前为止，我还没有专家，但看起来你在没有应用切换的情况下从getvalue函数返回值。我认为返回需要在切换功能之后。

从子控制器调用工厂时如何更新显示

2 个答案: