传递/在工厂更新数据从一个控制器到另一 [英] Passing/Updating Data in a Factory from One Controller to Another

问题描述

我不知道如果我有一个最佳实践问题，即我试图在神秘和奇妙的方式或阉我对AngularJS的抓地力来解决这个挑战只是现在还没有。

场景：所以我一直在试图想出一个办法让originCity.cityName在页面上输出了几次，都引用相同的工厂里相同的对象希望如果我把它设置为其他值（测试字符串为例），那么这将追溯替换所有的 {{} originCity.cityName} 我周围有页。

  module.service（'cityFactory'，函数（）{    返回{
        originCity：{
            的cityName：TestLocation
        };        //更新城市
        this.update =功能（newCityName）{
            this.originCity.cityName = newCityName;
        }
    }）;
 

在两个单独的控制器我有以下调用工厂：

  $ scope.originCity = cityService.originCity
 

和，向人们展示，在一个单独的控制器我有以下调用工厂的更新方法：

  $ scope.setCity =功能（）{
    city​​Service.update（'测试字符串'）​​;
}
 

正如我上面提到的，这是很新的给我，所以我可能会去这一切错误的，但我希望有一个方法，一个工厂，我可以从任何地方拨打页面上（只要依赖都是行）在一些地方，以更新的价值。

如果我的console.log 的 this.originCity.cityName 在工厂里面的更新方法，那么它输出正确的测试字符串，但对数据的其他引用目前不更新。

解决方案

  module.factory（'cityFactory'，函数（）{
    VAR _cityName = NULL;
    变种cityFactoryInstance = {};    //从DOM外面更新城市：
    VAR _Update =功能（newCityName）{
        _cityName = newCityName;
    }    city​​FactoryInstance.update = _Update;
    city​​FactoryInstance.cityName = _cityName;
    返回cityFactoryInstance;
}）;module.controller（'控制器1'，
    ['$范围，cityFactory'，函数（$范围，cityFactory）{        $ scope.originCity.cityName = cityFactory.cityName;
    }]）;module.controller（'控制器2'，
    ['$范围，cityFactory'，函数（$范围，cityFactory）{        $ scope.originCity.cityName = cityFactory.cityName;
    }]）;
 

在DOM：

  {{originCity.cityName}}
 

I'm not sure if I am having a "best practices" issue where I am trying to solve this challenge in a weird and wonderful way or wether my grip on AngularJS just isn't there yet.

Scenario: So I have been trying to come up with a way to have "originCity.cityName" be output on the page a few times, all referencing the same object inside the same factory with the hope that if I set it to some other value ("Test String" for example) then it would retroactively replace all of the {{originCity.cityName}} I have around the page.

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

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

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

In two seperate controllers I have the following call to the factory:

$scope.originCity = cityService.originCity

And, to demonstrate, in a seperate controller I have the following call to the update method of the factory:

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

As I mentioned above, this is very much new to me so I might be going about this all wrong but I was hoping to have a factory with a method that I can call from anywhere on the page (so long as the dependencies are all in line) to update that value in a few places.

If I console.log the this.originCity.cityName in the update method inside the factory then it outputs correctly as Test String but the other references to the data do not currently update.

解决方案

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;
    }]);

In DOM:

{{originCity.cityName}}

这篇关于传递/在工厂更新数据从一个控制器到另一的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！