如何将数据asynchrone从模型返回到AngularJS中的控制器

时间:2014-03-29 19:06:42

标签: javascript angularjs asynchronous byref

我是AngularJS的新手并尝试创建一个MVC应用程序,其中Controller可以连接到多个相同类型的模型。

所以:

我创建了一个连接到Test模型的控制器,以获取异步信息,如:

function TestController($scope, Test)
{
    $scope.model = {};  

    $scope.load : function(id) {
         Test.get($scope, id);
    }
}

该模型使用http协议从服务器检索(json)信息。该模型看起来像:

myApp.factory('Test',function($http) {
    get : function(variable, id) {
        $http({
           url: 'api/load/'+id
        }).success(function(response) {
           variable.model = response;       
        });
     } 
});

名称'型号'被硬连接到控制器中。所以无法加载 第二个测试模型,在控制器中,因为现有的将被覆盖。

如果我改变了行:

    Test.get($scope, id);

    Test.get($scope.model, id);

模型

     variable = response;

Angular停止的魔力。模型未在控制器中更新。没有byRef 在Javascript。

是否有解决方法,因此模型可以在一个控制器中多次使用?

1 个答案:

答案 0 :(得分:2)

嗯,您不需要像这样调用服务。首先,$ http调用返回promises,可以使用'then'回调来处理。因此,您可以为类似的调用添加多个不同的回调。在你的情况下:

myApp.factory('Test',function($http) {
    get : function(id) {
        return $http({
            url: 'api/load/'+id
        });
    } 
});

在你的控制器中:

function TestController($scope, Test) {
    $scope.model = {};  

    $scope.load : function(id) {
        Test.get(id).then(function(result) {
             $scope.var1 = result;
        });

        Test.get(id).then(function(result) {
             $scope.var2 = result;
        });
    }
}

另一种方法是这样做:

myApp.factory('Test',function($http) {
    get : function(context, variable, id) {
        return $http({
            url: 'api/load/'+id
        }).success(function(result) {
            context[variable] = result;
        });
    } 
});

在你的控制器中:

function TestController($scope, Test) {
    $scope.model = {};  

    $scope.load : function(id) {
        Test.get($scope, 'var1', id);
        Test.get($scope, 'var2', id);
    }
}