得到angularjs工厂从后端空模型和更新在成功控制变量 [英] Get empty model from backend in angularjs factory and update controller variable upon success

问题描述

这是我厂和我厂HTTP调用，我到我的用户变量分配值，但它没有更新我的控制器。

  mainApp.factory（'AccountFactory'，['$ HTTP'，函数（$ HTTP）{
                VAR USER = {                };                功能getLogOnModel（）{
                    $ http.get（HTTP：//本地主机/ mylocalspecial /帐号/登录）。然后（功能（数据）{
                        用户数据。数据=;
                        警报（JSON.stringify（数据。数据））;
                        返回的数据;
                    }）;
                }                //初始化模型（或离开它的控制器初始化它）
                getLogOnModel（）;                返回{
                    用户：用户，
                    getLogOnModel：getLogOnModel
                };            }]）;
 

这是我的控制器，你可以在我的控制器看到我的工厂分配的用户变量$ scope.logOnModel但我的控制器没有更新。

  mainApp
        .controller（'的AccountController'，['$范围，AccountFactory'，
            AuthenticationServiceFactory
            ，功能（$范围，AccountFactory，
                AuthenticationServiceFactory）{                $ scope.logOnModel = {};
                $ scope.customerModel = {};                $ scope.logOnModel = AccountFactory.User;
                警报（JSON.stringify（AccountFactory.User））;            }]）;
 

解决方案

这是会发生什么：

  // 1
变种用户= {}; //本地用户变量引用新的对象：＃OBJ1// 2
返回{
    用户：用户// AccountFactory.User引用相同的对象：＃OBJ1
    ...
}// 3
用户数据。数据=; //局部用户变量引用新的对象：＃OBJ2
                    // AccountFactory.User仍然引用旧的对象：＃OBJ1
                    // $ scope.logOnModel仍然引用AccountFactory.User
                    //又名老物件：＃OBJ1
 

---

解决方案1：

不要重新分配整个对象（用户=＆LT; some_new_object＆GT; ），只是重新分配其属性：

  User.prop1 = data.data.prop1;
User.prop2 = data.data.prop2;
...
 

（这是乏味且容易出错，如果性能比一对夫妇以上。）

---

解决方案2：

您可以在整个服务分配给一个范围属性，并从范围内引用它。

  mainApp.factory（'AccountFactory'，['$ HTTP'，函数（$ HTTP）{
    变种服务= {};
    service.User = {};
    service.getLogOnModel =功能（）{
        $ http.get（...）。成功（功能（数据）{
            service.User =数据;
            警报（JSON.stringify（数据））;
        }）;
    };    //初始化模型（或离开它的控制器初始化它）
    service.getLogOnModel（）;    退换货服务;
}]）;mainApp.controller（'的AccountController'，['$范围，AccountFactory'，
    功能（$范围，AccountFactory）{
        $ scope.account = AccountFactory;
        ...
    }
]）;//在HTML：
{{account.User.EmailAddress}}
 

又见这个 短演示

This is my factory and in my factory http call I am assigning value to my User variable but it is not updating my controller.

mainApp.factory('AccountFactory', ['$http', function ($http) {
                var User = {

                };

                function getLogOnModel() {
                    $http.get("http://localhost/mylocalspecial/Account/LogOn").then(function (data) {
                        User = data.data;
                        alert(JSON.stringify(data.data));
                        return data;
                    });
                }

                // Init model (or leave it for the controller to init it)
                getLogOnModel();

                return {
                    User: User,
                    getLogOnModel: getLogOnModel
                };

            }]);

This is my controller as you can see in my controller I am assigning factory User variable to $scope.logOnModel but my controller is not updating.

mainApp
        .controller('AccountController', ['$scope', 'AccountFactory',
            'AuthenticationServiceFactory'
            , function ($scope, AccountFactory,
                AuthenticationServiceFactory) {

                $scope.logOnModel = {};
                $scope.customerModel = {};

                $scope.logOnModel = AccountFactory.User;
                alert(JSON.stringify(AccountFactory.User));



            }]);

解决方案

This is what happens:

// 1
var User = {};   // local User variable references new object: #obj1

// 2
return { 
    User: User   // AccountFactory.User references same object: #obj1
    ...
}

// 3
User = data.data;   // local User variables references new object: #obj2
                    // AccountFactory.User still references old object: #obj1
                    // $scope.logOnModel still references AccountFactory.User
                    //     a.k.a. old object: #obj1

---

Solution 1:

Do not reassign the whole object (User = <some_new_object>), just reassign its properties:

User.prop1 = data.data.prop1;
User.prop2 = data.data.prop2;
...

(This is tedious and error-prone if the properties are more than a couple.)

---

Solution 2:

You could assign the whole service to a scope property and reference it from the scope.

mainApp.factory('AccountFactory', ['$http', function ($http) {
    var service = {};
    service.User = {};
    service.getLogOnModel = function () {
        $http.get("...").success(function (data) {
            service.User = data;
            alert(JSON.stringify(data));
        });
    };

    // Init model (or leave it for the controller to init it)
    service.getLogOnModel();

    return service;
}]);

mainApp.controller('AccountController', ['$scope', 'AccountFactory',
    function ($scope, AccountFactory) {
        $scope.account = AccountFactory;
        ...
    }
]);

// In HTML:
{{account.User.EmailAddress}}

See, also, this short demo.

这篇关于得到angularjs工厂从后端空模型和更新在成功控制变量的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！