как угловые служебных данные ДИРЕКТИВЫ BIND контроллера

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 не определено, потому что при загрузке в директиве области вашего контроллера еще не заполнена. Что вы можете сделать, чтобы исправить это:

• Изменения 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; 
     } 
    } 
    } 
});