Angular ajax 仅在指令中使用 $timeout

Question

我有一个发出 ajax 请求的指令。在我将它包装在 $timeout 中之前它是行不通的：

return {
        restrict: 'E',
        scope : {
            param1: '=',
            param2: '='
        },
        templateUrl: "teams/views/myDirective.html",
        link: function($scope){
            $timeout(function(){
                $http.get(endPointUrl)
                    .success(function(result){
                        console.log(result)
                    })
                    .error(function(err){
                        console.log(err);
                    });
            }, 0);
        }
    };

有人知道为什么吗？提前感谢回答！

Answer 1

$http 只调用 returns 承诺。以下代码可能对您有所帮助。理想情况下，应该在服务中而不是指令的 link 函数中完成像操作一样获取数据。

app.service('myService', ['$http',
  function($http) {
    this.getData = function() {
      return $http({
        method: 'GET',
        url: 'http://httpbin.org/get',
        headers: {
          'Content-Type': "application/json"
        }
      }).
      success(function(data, status) {
        return data;
      }).
      error(function(data, status) {
        return "Request Failed";
      });

    }
  }
]);

app.directive('appDirective', ['myService',
  function(myService) {
    return {
      link: function($scope) {
        myService.getData().then(function(data) {
          $scope.name = 'User, Data fetched as: ' + JSON.stringify(data);
        })
      }

    }
  }
])

工作示例：http://plnkr.co/edit/stdJxAnHINORI06pPZJX?p=preview

Angular ajax 仅在指令中使用 $timeout

Angular ajax working only with $timeout in directive

angularjs

angular-directive