0

角度を学ぶだけです。

基本的にjsonをロードするコントローラーがあります。私はディレクティブでこれを反復しようとしています。私はこれを間違っていると思いますか？どんな助けでも大歓迎です。デバッガーでは、スコープにデータがないため、 foreach が反復することはありません。非同期呼び出しに問題があると思いますか？

$scope.result をハード コーディングして遊んで、コントローラーに同期的に読み込まれるようにしましたが、これは正常に機能します。更新されないように見えるのは、非同期の .then 呼び出しだけです。

 angular.module('dilApp')

 .controller('MainCtrl',  function($scope, $http) {
 $scope.result = {};

 $http.get('data/data.json')
       .then(function(res){
          $scope.result = res.data;                
  });

ディレクティブ ..

.directive('myTable', function () {
    return {
        restrict: 'E',
        link: function ($scope, element, attrs) {

            var html = '<table>';
            angular.forEach($scope.result, function (row, index) {
               .....
            })
            html += '</table>';           
            element.replaceWith(html)
        }
    }
});

さらに、json の非同期呼び出しにブレークポイントがある場合。「正しい」動的データが読み込まれていることがわかります。リンク関数内の $watch プロパティに出くわしましたが、うまくいきません。

編集 - ディレクティブのリンク メソッドに追加されました。$http.get メソッドが起動されたときに、この起動を正しく確認できるようになりました。リンクから既にレンダリングされたhtmlを取得して更新する方法がわかりません。

 $scope.$watch('result', function($scope){
                // $scope has new data how do I get the template to update ??
        });
4

1 に答える 1

0

値を設定するだけの場合は、返された $http オブジェクトの success メソッドと error メソッドを使用してみてください。これらのメソッドは、$http によって返されるオブジェクトに固有です。

$http.get('data/data.json')
  .success(function(data, status, headers, config){
    $scope.result = data;                
  })
  .error(function(data, status, headers, config){
    console.log(data);  
  )};

発生しているエラーも役立つ場合があります。

また、 を参照して、ディレクティブをコントローラーと密接に結び付けたくないでしょう$scope.result。データを渡して属性としてレンダリングしたいだけかもしれません。その場合、egghead.ioにはこの件に関する優れたチュートリアルがあります (ディレクティブ アイソレート スコープ)。

于 2013-06-03T22:31:21.430 に答える