javascript – 服务中的AngularJS $http请求

我试图从服务中获取一些数据到控制器中,并且我一直得到一个未定义的变量.

angular
    .module("classes")
    .service("MyService", function ($http) {

        this.foo;
        $http.get("/classes/all").then(function (response) {
            this.fighters = response.data;
            this.foo = this.fighters;
            console.log(this.foo);
        });
        console.log(this.foo);

    })

当我运行这个时,我进入控制台,按此顺序,第11行未定义,然后第9行返回数组.

当我在控制器中尝试获取变量foo时,它也表示未定义.

$scope.fooFighters = MyService.foo;

解决方法:

原因是您的API调用的异步执行.我建议你重写代码以使用将返回promise对象的工厂.无需带来不必要的变量.

angular.module("classes").factory("MyService", function($http) {
    return {
        fighters: function() {
            return $http.get("/classes/all").then(function(response) {
                return response.data;
            });
        }
    }
})

在控制器中,您可以通过在控制器中注入服务然后通过引用它来获取值

 MyService.fighters().then(function(data){
   $scope.fooFighters = data;
  });

标签：javascript,http,angularjs,angularjs-service
来源： https://codeday.me/bug/20190622/1264107.html