Question

我有一个AngularJS工厂返回一个简单的模型，它在控制器中使用：

app.factory('myFactory1', function () {
    var model = {
        foo: 'original'
    };

    function changeModel () {
        model = {
            foo: 'changed'
        }
        // model.foo = 'changed'; would work! why?
    }

    // esposed API
    return {
        model: model,

        changeModel: function () {
            changeModel();
        }
    };  

});

function FooCtrl (myFactory1) {
    myFactory1.changeModel();
    this.model1 = myFactory1.model // model1 not updated
}

问题是在调用chnageModel（）之后，控制器中的视图模型不会更新。这个小提琴的完整例子： http://jsfiddle.net/eobq064h/1/

Answer 1

问题出在您关闭model的工厂，然后用新的model替换model。此替换不影响原始闭包 - 原始model未更改，闭包由对新实例的引用替换。而不是替换model，您必须更新model。

的内容

这正是您注释掉的行正常工作的原因。它更新了模型的内容，而不是模型。

function FooCtrl (myFactory1) {
    myFactory1.changeModel();
    this.model1 = myFactory1.model // model1 not updated
}

app.factory('myFactory1', function () {
    var model = {
        foo: 'original'
    };

    function changeModel () {
        model.foo = 'change';
    }

    // esposed API
    return {
        model: model,

        changeModel: function () {
            changeModel();
        }
    };  

});

function FooCtrl (myFactory1) {
    myFactory1.changeModel();
    this.model1 = myFactory1.model // model1 not updated
}

Answer 2

这里已更新为您想要的，加上添加注释和标记您的功能（在工厂和服务上）但不接触您的FooCtrl。只是你的factory1和factory2

http://jsfiddle.net/eobq064h/2/

app.factory('myFactory2', function TheFactory() {
    var model = {
        foo: 'original'
    };

    // returning a new service instance
    return new TheService();
    // esposed API
    // returning a service with api and a model
    function TheService() {
        var oThis = this;

        oThis.model = model;

        // public methods
        oThis.changeModel = function () {
            changeModel();
        }

        // private methods
        function changeModel() {
            oThis.model.foo = 'changed';
        }
    };  
});

AngularJS：工厂模型未在控制器中更新

2 个答案: