小编典典

在Angular.js中进行AJAX调用的最佳实践是什么？

angularjs

我正在阅读这篇文章：http :
//eviltrout.com/2013/06/15/ember-vs-
angular.html

它说，

由于缺乏约定，我想知道有多少Angular项目依赖于不良行为，例如直接在控制器内进行AJAX调用？由于依赖注入，开发人员是否将路由器参数注入指令中？AngularJS新手开发人员是否会以经验丰富的AngularJS开发人员认为惯用的方式来构造代码？

我实际上是$http从Angular.js控制器进行调用。为什么这是一个不好的做法？那么$http拨打电话的最佳做法是什么？为什么呢？

阅读 213

2020-07-04

共1个答案

小编典典

编辑：这个答案主要集中在版本1.0.X。为避免混淆，已对其进行了更改，以反映截至2013年12月5日的所有当前Angular版本的最佳答案。

这个想法是创建一个服务，该服务向返回的数据返回一个承诺，然后在您的控制器中调用它并在其中处理该承诺以填充$ scope属性。

服务

module.factory('myService', function($http) {
   return {
        getFoos: function() {
             //return the promise directly.
             return $http.get('/foos')
                       .then(function(result) {
                            //resolve the promise as the data
                            return result.data;
                        });
        }
   }
});

控制器：

处理promise的then()方法并从中获取数据。设置$ scope属性，然后执行您可能需要做的其他事情。

module.controller('MyCtrl', function($scope, myService) {
    myService.getFoos().then(function(foos) {
        $scope.foos = foos;
    });
});

视野中的承诺解决方案（仅1.0.X版）：

在原始答案的目标Angular 1.0.X中，Promise将由View进行特殊处理。当他们解析时，其解析值将绑定到视图。 在1.2.X中已弃用

module.controller('MyCtrl', function($scope, myService) {
    // now you can just call it and stick it in a $scope property.
    // it will update the view when it resolves.
    $scope.foos = myService.getFoos();
});

2020-07-04