どの角度指令バインドコントローラのサービスデータ

Question

controller: 
 
service.checkSub(function(data){ 
 
    $scope.showSub = data.subscribe? false : true; 
 
}) 
 

 
directive: 
 
app.directive('showSub', function() { 
 
    return { 
 
     restrict: 'E', 
 
     replace: true, 
 
     scope: { 
 
      showSub: '=show' 
 
     }, 
 
     templateUrl: '<div data-ng-show="show">test</div>', 
 
     link: function(scope, element, attrs) { 
 
      console.log(scope.showSub); // undifined 
 
      if(scope.showSub) { 
 
       scope.show = true; 
 
      }else { 
 
       scope.show = false; 
 
      } 
 
     } 
 
    } 
 
});

<show-sub show="showSub"></show-sub>

なぜディレクティブでscope.showSubは未定義ある、と私はディレクティブを制御するためにそれを使用したいですか？私はそれをどうすればいいのですか？

Answer 1

...のようになりますscope.showSubは、コントローラのスコープのshowSubがまだ記入されていないため、ディレクティブにロードするときに定義されていません。あなたはそれを修正するために何をすることができます。

• 変更templateUrl
templateに変更 ng-show="show" ng-show="showSub"
• にあなたが直接あなたのテンプレートでスコープ変数にバインドできるよう（それは、必要とされていないlink機能を失います）

コード：

app.directive('showSub', function($timeout) { 
    return { 
     restrict: 'E', 
     replace: true, 
     scope: { 
      showSub: '=show' 
     }, 
     template: '<div data-ng-show="showSub">test</div>', 
     link: function(scope, elem) { 
      // this function isn't needed, but to show you it gives undefined due to the async call 
      console.log(scope.showSub); // undefined 
      $timeout(function(){ 
       console.log(scope.showSub); // true 
      }, 1500); 
     } 
    } 
}); 

Here is a jsfiddle

Answer 2

お客様の指令は問題ありませんが、サービスには問題があります。

service.checkSub(function(data){ 
    $scope.showSub = data.subscribe? false : true; 
}) 

$ scope.showSubは、親スコープにする必要があります。

あなたは$ scope.showSub内のデータを持っていることを確認し

Answer 3

あなたは範囲によってshowSubの値を取得することができます。$ parent.showSub

だからあなたのコードは

app.directive('showSub', function() { 
    return { 
    restrict: 'E', 
    replace: true, 
    scope: { 
     showSub: '=show' 
    }, 
    templateUrl: '<div data-ng-show="show">test</div>', 
    link: function(scope, element, attrs) { 
     console.log(scope.$parent.showSub); 
     if(scope.$parent.showSub) { 
      scope.show = true; 
     }else { 
      scope.show = false; 
     } 
    } 
    } 
});