angularjs - Angular 服务中的云端点

Question

我正在尝试将 Google 云端点 api 放入 Angular 服务中，以使逻辑更清晰。但是我不知道当云端点响应时如何让控制器更新模型（从该服务获得的值）。这是代码： 服务：

angular.module('fooApp').service('FooService', function FooService() {
//variable to keep the data from server
var tl={};

this.retrieve=function(){

    //cloud endpoint api callback 
    var gapiCallback=function(){
        gapi.client.fooendpoint.foos.listFoos().execute( function(resp) {
                    tl=resp.items;
        });
    };

    var apiRoot='https://fooapp.appspot.com/_ah/api';
    gapi.client.load('fooendpoint', 'v1', gapiCallback, apiRoot);
};


this.get=function(){
    console.log(tl);
        return tl;
    }
  });

控制器：

angular.module('fooApp').controller('DeviceCtrl', function ($scope,FooService) {

FooService.retrieve();

$scope.myFoos =FooService.get();

});

看法：

<ul class="nav nav-list">
    <li ng-repeat="t in myFoos ">
        <ul>
           <li >Foo attr1 = {{t.attr1}}</li>
           <li >Foo attr2 = {{t.attr2}}</li>
        </ul>
    </li>                                   
</ul>

提前致谢。

Answer 1

FooService.get()将调用包装起来$apply以启动摘要循环，以便 UI 将更新。

$scope.$apply(function() {
    $scope.myFoos = FooService.get();
});