使用不触发模型更改的服务更新$ http模型

时间:2015-06-04 11:54:12

标签: angularjs http model angularjs-service

我有以下型号:

 var MODEL = { myTable: [], anotherTable: [] }; //--- initially set as empty arrays

MODEL是一个全局变量,因为它用于在不同的控制器中绑定应用程序模型。

我已经定义了一个更新模型的服务,从返回表行的php页面获取数据:

myApp.factory('myAppUtils', function($http) {
     return {
            updateModelTable: function(tableName) {
                var pageToCall = "";
                var params = "";
                switch(tableName){
                    case 'myTable':
                        pageToCall = "myTable.php";
                        params = "";
                        break;
                    case 'anotherTable':
                        break;
                    default:
                        break;
                }

                var updateModel = function(tableName, data){
                    MODEL[tableName] = data;
                };

                var url = "/" + pageToCall;
                $http.get(url).
                    success(function(data, status, headers, config) {
                        updateModel(tableName, data);
                    }).
                    error(function(data, status, headers, config) {
                        alert("error");
                    });
            }
        };
});

然后是其中一个控制器:

myApp.controller("MyTableCtrl", function($scope, myAppUtils){
    $scope.table = MODEL.myTable;
    myAppUtils.updateModelTable("playersTable");
});

运行应用后,myAppUtils.updateModelTable()功能会被正确调用,它会成功更新MODEL,但MyTableCtrl控制的视图不会相应更新。

我尝试做的是设置某种CRUD操作,从sql db获取和设置值。例如,我想插入一条新记录,然后调用更新函数来更新模型,从而更新视图,但这种情况不会发生。

这是正确的吗?#34;棱角分明的" 做事的方式

任何提示?我做错了什么?

提前致谢

1 个答案:

答案 0 :(得分:1)

而不是使用全局变量在控制器之间共享数据,您可以使用单独的服务来缓存数据,因为Angular Service是单例。

所以在你的情况下,创建一个服务

myApp.service('modelService',function() {
    var model = {
      myTable: [],
      anotherTable: []
    };

    return model;
});

然后在您的工厂中,注入此服务并将updateModel更改为

var updateModel = function(tableName, data){
    modelService.myTable = data;
};

在您的控制器中,注入modelService并将其绑定到$scope

$scope.model = modelService;

最后,在您看来,您可以访问model.myTable,您可以在工厂更新后自动更新。{/ p>