2013-05-14 108 views
2

我試圖阻止在禁用元素時顯示twitter引導工具提示。我可以用下面的代碼:當元素變爲禁用時,動態禁用工具提示

app.directive("tooltip",function(){ 
    return { 
      restrict:"A", 
      require: 'tooltipDirection', 
      link:function(scope,element,attrs,directionController){ 

       attrs.$observe('ngDisabled',function(){ 


        console.log("ngDisabled has changed: " + attrs.ngDisabled); 

       });     

       if(scope.$eval(attrs.ngDisabled)!=true){ 

       $(element).attr('title',attrs.tooltip).tooltip({placement:directionController.direction}); 
       } 
      } 
    }; 

}); 

但是,這隻適用於頁面加載和元素已被禁用。我需要一種動態禁用工具提示的方法。例如,如果我點擊一個修改範圍變量(editing_bln)值的按鈕(edit),第二個按鈕按鈕(save)就會通過ngDisabled和範圍變量editing_bln被禁用。我現在希望工具提示也被禁用 - 事實並非如此。我嘗試在鏈接函數中使用attrs。$ observe,但是,在頁面加載時也會調​​用它,而不會在變量edit_bln發生更改時調用。這裏是按鈕代碼:

<button type="button" ng-class="{'btn-danger':editing_bln}" class="btn btn-mini" style="margin-top:10px;margin-left:20px;" ng-click="editing_bln = !editing_bln"><i tooltip-direction="top" tooltip="Click to Edit Content" ng-class="{'icon-white':editing_bln}" class="icon-pencil"></i></button> 

<button ng-disabled="editing_bln" type="button" class="btn btn-mini" style="margin-top:10px;" ng-click="responseAdd()"><i tooltip-direction="top" tooltip="Add response to group." class="icon-plus"></i></button> 

我猜我缺少鏈接功能中的標記。感謝任何和所有答覆。

回答

1

什麼,你可以嘗試做的是設置提示觸發到無法識別的觸發,這本質上使工具提示並不觸發:

<button ng-disabled="editing_bln" type="button" class="btn btn-mini" 
     style="margin-top:10px;" ng-click="responseAdd()"> 
    <i tooltip-direction="top" tooltip="Add response to group." 
     tooltip-trigger={{ editing_bln ? 'none' : 'mouseenter'}}" 
     class="icon-plus"></i> 
</button>