指令中的AngularJS資源調用

我正在嘗試創建一個AngularJS指令，該指令調用使用$resource創建的服務，並使用模板中的屬性值並使結果在元素範圍內可用。指令中的AngularJS資源調用

我有一個非常簡單的服務：

services.factory('Concept', ['$resource', function($resource) { 
    return $resource('http://example/api/:id'); 
}]);

而且一個指令：

directives.directive('anConcept', ['Concept', function(Concept) { 
    return { 
    scope: { 
     anConcept: '@' 
    }, 
    restrict: 'A', 
    controller: function($scope, $element) { 
     $scope.results = Concept.get({id: concept}); 
    } 
    } 
}]);

然後我試着在我看來調用此：

<div an-concept="1"> 
    {{results}} 
</div>

縱觀網絡在我的瀏覽器的調試器中，我可以看到所做的請求，但結果不在範圍中提供的元素。

我確定我犯了一個非常基本的錯誤，但我無法弄清楚它是什麼。

來源

2015-02-10 Alex

請注意，當您使用$resource時，您將收到一份承諾。此外，如果指令的作用域是隔離的，那麼您可能會遇到$scope的results屬性出現問題。

angular.module('myApp', ['ngResource']) 
 
    .factory('Concept', ['$resource', 
 
    function($resource) { 
 
     return $resource('https://api.stackexchange.com/2.2/info'); 
 
    } 
 
    ]) 
 
    .directive('anConcept', ['Concept', 
 
    function(Concept) { 
 
     return { 
 
     restrict: 'A', 
 
     link: function($scope, $element, $attrs, $controllers) { 
 
      Concept.get({ 
 
      site: $attrs.anConcept 
 
      }, function(results) { 
 
      $scope.results = results.items[0].total_users; 
 
      }); 
 
     } 
 
     }; 
 
    } 
 
    ]);

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular-resource.js"></script> 
 
<div ng-app='myApp'> 
 
    <div an-concept="stackoverflow"> 
 
    Total stackoverflow users: {{results}} 
 
    </div> 
 
</div>

來源

2015-02-10 15:37:33 JcT

謝謝，這確實是一個孤立的範圍問題。 – Alex 2015-02-10 16:21:18

這是因爲get的結果是一個承諾。你需要做的是這樣的：

Concept.get({id: concept}).success(function(data) { 
    $scope.results = data; 
};

編輯

對不起，我想我犯了一個錯誤，$resource作品有點不同，那麼$http：

Concept.get({id: concept}, function(data) { 
    $scope.results = data; 
};

來源

2015-02-10 14:29:25

如果你想看到值超出指令，我會說你不會看到它是一個簡單的。因爲你的指令是ISOLATED-SCOPE指令。它意味着你在該範圍內的值將與父範圍隔離，你會沒有看到這個值超出了指令的範圍（有一種方法可以獲得這個獨立的範圍）。但是如果你想在指令中看到它，我會說你的代碼是正確的代碼。如果響應已被接受，你的結果將被定義。

來源

2015-02-10 14:31:08

指令中的AngularJS資源調用

回答

相關問題