angleJsでいつかブートストラップポップオーバーを表示できないようにするには

Question

私はカスタムangleJs指示文でブートストラップポップオーバーを使用します。 $scope.buytypeButton= {type:false}ボタンを無効にして、ポップオーバーにエラーメッセージを表示するとエラーメッセージが表示されます。 しかし、私は$scope.buytypeButton= {type:true}ボタンがアクティブで、ポップオーバーを表示しないときにしたいです。

HTML：

<my-next-level id='pop' buytype-button='buytypeButton' 
popover-html='{{message}}' click-next='clickNext()'></my-next-level> 

angularJs：

app.controller('MainCtrl', function($scope,$http) { 
       $scope.message='error'; 
       $scope.buytypeButton= {type:false}; 
}; 



app.directive('myNextLevel', function() { 
     return { 
      restrict: 'EA', 
      scope: {buytypeButton:'=', popoverHtml:'@', clickNext:'&'}, 
      template: '<a href="" tabindex="0" class="btn btn-block btn-success 
ng-class:{ disabled: !buytypeButton.type }" role="button" data-ng-click="clickNext()" 
>next</a>', 
       link: function (scope, el, attrs){ 
        $(el).popover({ 
         trigger: 'click', 
         html: true, 
         toggle:'popover', 
         title: 'notice!!', 
         content: scope.popoverHtml, 
         placement: 'top' 
        }); 
        attrs.$observe('popoverHtml', function(val){ 
         $(el).popover('hide'); 
         var popover = $(el).data('bs.popover'); 
         popover.options.content = val; 
        }); 
       } 
      }; 
     }); 

回答

私はこのコードを使用して、それが仕事の罰金です。

$(el).click(function() { 
        if(scope.buytypeButton.type == true){ 
         $(el).popover('hide'); 
        } 
       }); 

my my directive。

Answer 1

回答：

私はこのコードを使用して、それが仕事の罰金です。

$(el).click(function() { 
        if(scope.buytypeButton.type == true){ 
         $(el).popover('hide'); 
        } 
       }); 

my my directive。

app.directive('myNextLevel', function() { 
      return { 
       restrict: 'EA', 
       scope: {buytypeButton:'=', popoverHtml:'@', clickNext:'&'}, 
       template: '<a href="" tabindex="0" class="btn btn-block btn-success 
    ng-class:{ disabled: !buytypeButton.type }" role="button" data-ng-click="clickNext()" 
    >next</a>', 
        link: function (scope, el, attrs){ 
         $(el).popover({ 
          trigger: 'click', 
          html: true, 
          toggle:'popover', 
          title: 'notice!!', 
          content: scope.popoverHtml, 
          placement: 'top' 
         }); 
    $(el).click(function() { 
        if(scope.buytypeButton.type == true){ 
         $(el).popover('hide'); 
        } 
       }); 
     attrs.$observe('popoverHtml', function(val){ 
          $(el).popover('hide'); 
          var popover = $(el).data('bs.popover'); 
          popover.options.content = val; 
         }); 
        } 
       }; 
      }); 

Answer 2

ブートストラップポップオーバーを使用していません。私はあなたがbuytypeButtonを見て、それが変更されたときに表示/非表示のポップオーバーを見ることができると思います。

link: function (scope, el, attrs){ 
    // ... your code 

    scope.$watch('buytypeButton', newVal => { 
     if (newVal) { 
      $(el).popover('hide'); 
     } else { 
      $(el).popover({ 
       // ... 
      }) 
     } 
    }) 
}