AngularJS指令和從服務中提取數據

我想弄清楚從服務中將數據拉入我的指令的正確方法。出於某種原因，我的$ watch語句在數據加載時不會被觸發。AngularJS指令和從服務中提取數據

link: function(scope, element, attrs){ 

      scope.loadtext = testService.getJSON(); 

      scope.$watch(scope.loadtext, function(newValue, oldValue){ 

       if (newValue !== oldValue){ 
        alert("watch working"); 
        element.addClass("red"); 
        element.html(newValue.ok); 
       } 
      }); 


     }

簡單的jsfiddle http://jsfiddle.net/jamesamuir/m85Ka/1/

但是，我不知道如果我處理這個正確的方式。我試圖深入瞭解指令的文檔，但似乎沒有提供解決此問題的很多見解。

來源

2013-05-16 jamesamuir

嘗試'範圍$腕錶（」 loadtext'，function（）{....}）;' –

Tim，感謝您的快速響應。我更新了正確的JSFiddle鏈接，並在其中嘗試了您的建議。它似乎沒有工作。更大的問題是，如果我甚至以正確的方式來做這件事。 – jamesamuir

我不確定你的最終目標是什麼，但我認爲你沒有使用正確的方法。無論如何，我更新了jsfiddle並保留了$ watch，儘管它不是必需的。

的問題是在這裏：

this.getJSON = function() { 
    $http.get('http://ricardohbin.com/cors/testcors.php') 
     .success(function(data) { 
      $rootScope.$apply(function(){ 
       alert(data); 
       return data; 
      }); 
     }). 
     error(function(data, status, headers, config) { 
      alert(status + " | bad"); 
     }); 
}

你return data沒有關聯到getJSON但在此代碼$rootScope.$apply回調。你不能return在這種情況下，改用作爲數據將異步那樣被加載的回調：

testService.getJSON(function(data) { 
    scope.loadtext = data; 
});

相反的：

$scope.loadtext = testService.getJSON();

http://jsfiddle.net/m85Ka/10/

來源

2013-05-16 22:56:02

這正是我正在尋找的。謝謝。 – jamesamuir

儘管Tim Withers的建議可以解決您的問題，但加載數據的正確方法是從視圖的控制器功能或在指令自己的控制器中。

來源

2013-05-16 14:47:11 Ketan

謝謝你的回覆。我用你的兩個建議更新了我的小提琴http://jsfiddle.net/jamesamuir/m85Ka/2/，但我仍然無法使它工作。似乎應該有一種更簡單的方式來加載服務的數據比這個更容易？ – jamesamuir

AngularJS指令和從服務中提取數據

回答

相關問題