如何使用服務在Angular控制器之間持久化對象實例？

Question

我試圖在Angular內部的多個控制器和指令之間傳遞“用戶模型”實例。 我的模型如下所示：

var userFactory = function (addressFactory) {
    var User = function () {
        BillingAddress = addressFactory.createAddress();
        ShippingAddress = addressFactory.createAddress();
        FirstName = '';
    }

    return {
        create: function(){return new User()}
    }
}


var userModel = function (userFactory) {

    var model = userFactory.create();

    return {
        model: model
    }
}
app.factory('addressFactory', ['securedHttp', 'utility', addressFactory]);
app.factory('userFactory', ['addressFactory', userFactory]);

userModel.model將用於綁定到Angular表單，包括多個控制器。 我希望所有控制器中的更改都能將其更改反映回該實例。

我希望所有服務都能夠引用此userModel.model並獲取對該模型進行的最新更改。

 var MyController1 = function ($scope, userModel) {
   $scope.user = userModel;
   userModel.model.FirstName = "blahblah";

}
   var MyDirectiveController2 = function ($scope, userModel) {
        //EXPECT:
        userModel.model.FirstName == "blahblah";
}

var myOtherService = function(userModel){
//EXPECT:
userModel.model.FirstName == "blahblah";
}

這不起作用。 我的理解是服務是單例的，但是我無法更改模型上的數據，並且無法在不同的上下文中進行反映。

關於執行此操作的正確方法有何建議？ 我可以共享作用域，也可以將作用域變量傳遞給每個控制器，但這似乎是一種將已經作為服務存在的依賴項傳遞出去的方式。

Answer 1

是的，服務是單例的，但您的userFactory不會為模型對象利用設置器/獲取器。

var userFactory = function(addressFactory) {

    var model = null;
    var create = function() {
        var self = this;
        self.BillingAddress = addressFactory.createAddress();
        self.ShippingAddress = addressFactory.createAddress();
        self.FirstName = '';
    };

    var setModel = function(data) {
        model = data;
    };

    var getModel = function() {
        return model;
    };

    return {
        create : create,
        getModel : getModel,
        setModel : setModel
    }

}

Answer 2

您的代碼讓我有些困惑。 您是否要將數據綁定到userFactory.billingAddress等或userModel.model？ 一個大問題是您正在設置self.model = userFactory.create（），但是userFactory.create沒有返回任何內容。 因此，基本上，user.model將是未定義的。

我不知道您的確切用例，因此無法提供最佳解決方案。 在大多數情況下，用戶模型將僅負責存儲用戶數據，用戶工廠將僅負責創建用戶，並且通常會從某些控制器/指令中調用。 一個例子是，從登錄控制器，我將調用loginServive，它將從后端api獲取成功登錄時的用戶詳細信息，然后將用戶詳細信息存儲在usermodel中。

在您的示例中，我不會從usermodel調用userFactory.create。 如果要從其他工廠或控制器創建模型，則將從該工廠/控制器調用create方法。 否則，我只是在userFactory中初始化userModel。

var userFactory = function (addressFactory, userModel) {
    var create = function () {
        userModel.model.BillingAddress = addressFactory.createAddress();
        userModel.model.ShippingAddress = addressFactory.createAddress();
        userModel.model.FirstName = '';
    }

    // if you want to expose create method to public
    return {
        create: create
    }
}

var userModel = function () {
    var model = {
      BillingAddress: {},
      ShippingAddress: {},
      FirstName = ""
    };

    return {
        model: model
    }
}

app.factory('userFactory', ['addressFactory', 'userModel', userFactory]);
app.factory('userModel', [userModel]);

編輯：我根據您試圖在代碼中實現的目的創建了一個插件。 在這里看到它。 我添加了幾個控制器，並將userModel注入其中。 我還演示了如何在兩個控制器之間進行數據共享並設置2向綁定，以便持久保存數據。 希望能有所幫助。

您的代碼中有幾個問題-

1. 在用戶函數中，您將必須將地址屬性附加到此，否則它將不會附加到創建的對象。 在您的情況下，FirstName等將附加到窗口對象，而不是用戶實例。

2. 您需要將userModel定義為要注入另一個控制器/服務等的工廠/服務，但是我想您已經知道這一點。

3. 我仍然認為userModel不是創建模型的地方。 如果要在應用程序init上創建模型，則只需在userFactory中進行創建，然后從那里將其保存在userModel中，如我在上面的代碼示例中所示。