Passing/Updating 工厂中的数据从一个控制器到另一个控制器

Question

我不确定我是否遇到 "best practices" 问题，我试图以一种奇怪而美妙的方式解决这个挑战，或者我对 AngularJS 的把握是否存在还.

场景: 所以我一直在想办法让"originCity.cityName"在页面上输出几次，都引用里面的同一个对象同一个工厂，希望如果我将它设置为其他值（例如 "Test String"），那么它将追溯地替换我在页面周围的所有 {{originCity.cityName}}。

module.service('cityFactory', function () {

    return {
        originCity: {
            cityName: 'TestLocation'
        };

        //Update the city
        this.update = function (newCityName) {
            this.originCity.cityName = newCityName;
        }
    });

在两个独立的控制器中，我对工厂进行了以下调用：

$scope.originCity = cityService.originCity

并且，为了演示，在一个单独的控制器中，我对工厂的更新方法进行了以下调用：

$scope.setCity = function() {
    cityService.update('Test String');
}

正如我上面提到的，这对我来说是非常新的，所以我可能会把这一切都搞错了，但我希望有一个工厂，它有一个我可以从页面上的任何地方调用的方法（只要依赖项都符合）以在几个地方更新该值。

如果我 console.log 工厂内部更新方法中的 this.originCity.cityName 那么它会正确输出 Test String 但其他对数据的引用当前不会更新。

Answer 1

module.factory('cityFactory', function () {
    var _cityName = null;
    var cityFactoryInstance = {};

    //Update the city from outside the DOM:
    var _update = function (newCityName) {
        _cityName = newCityName;
    }

    cityFactoryInstance.update = _update;
    cityFactoryInstance.cityName = _cityName;
    return cityFactoryInstance;
});

module.controller('controller1',
    ['$scope','cityFactory', function ($scope, cityFactory) {

        $scope.originCity.cityName = cityFactory.cityName;
    }]);

module.controller('controller2',
    ['$scope', 'cityFactory', function ($scope, cityFactory) {

        $scope.originCity.cityName = cityFactory.cityName;
    }]);

在DOM中：

{{originCity.cityName}}

Passing/Updating 工厂中的数据从一个控制器到另一个控制器

Passing/Updating Data in a Factory from One Controller to Another

factory

angularjs

angularjs-service