AngularJs指令监视异步数据

时间:2013-09-23 06:09:57

标签: angularjs

我正在尝试将prettyprint与一些ajax数据一起使用。问题是当调用指令时,数据没有准备好,所以我得到未定义的变量输出。

Plunkr:http://plnkr.co/edit/fdRi2nIvVzT3Rcy2YIlK?p=preview

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope,$http) {


$scope.result = $http.get('data.json').success(function(result){
  return result.data.dom
})

}); 


app.directive('prettyprint', function() {
return {
    restrict: 'C',
    link: function postLink(scope, element, attrs) {
          element.html(prettyPrintOne(scope.result))
    }
};
});

1 个答案:

答案 0 :(得分:5)

使用scope的{​​{3}}方法:

 scope.$watch("result" , function(n,o){
      element.html(prettyPrintOne(scope.result));
 })

而不是这个:

 $scope.result = $http.get('data.json').success(function(result){
      return result.data.dom
 })

使用此:

 $http.get('data.json').success(function(result){
      $scope.result =  result.dom;
 })

普兰克:$watch