2014-05-19 236 views
0

我有一個附帶的工具提示指令:角範圍問題

<div class="wrapper" ng-repeat="item in items"> 
    <span tooltip="item.description" tooltip-model="item.display" tooltip-border="item.color" tooltip-enable="!!item.description"> 
     <span>{{$parent.item.label}} - {{$parent.item.display}}</span> 
    </span> 
</div> 

的問題是,我需要使用$parent如果我想從模型參考item。有沒有辦法讓它在沒有$parent的情況下工作?我使用Angular UI bootsrap tooltip作爲參考,但我不知道它爲什麼使用$ eval和$觀察它是否可以將範圍內的屬性與=綁定,它使用隔離範圍,因爲它使用true for屬性)

.directive('tooltip', ['$compile', function($compile) { 
    var template = '<div class="description-popup" ng-style="{borderColor: color}" ng-class="{top:!bottom,bottom:bottom}">' + 
         '<p>{{content}}</p>' + 
         '<span class="close icon-cancel-1"></span>' + 
         '<span class="arrow" ng-style="{borderColor: color}"></span>' + 
        '</div>'; 
    return { 
     scope: { 
      color: '=tooltipBorder', 
      enable: '=tooltipEnable', 
      content: '=tooltip', 
      model: '=tooltipModel' 
     }, 
     compile: function(element, attrs) { 
      var linkerFn = $compile(template); 
      return function link(scope, element, attrs) { 
       var tooltip = linkerFn(scope, function(){}); 
       element.after(tooltip); 

       ... 

      }; 
     } 
    }; 
}]); 

我正在使用Angular 1.0.6所以隔離作用域以不同的方式工作。範圍不從父項繼承。

+1

您可以將完整的項目對象傳遞到隔離的範圍,它應該工作。 – Chandermani

回答

0

只是通過項目目標,太:

scope: { 
     color: '=tooltipBorder', 
     enable: '=tooltipEnable', 
     content: '=tooltip', 
     model: '=tooltipModel', 
     item: '=' 
    } 


<span item='item'> 

只是出於好奇,你爲什麼要使用1.0.6?

+0

如果在元素中使用'ng-repeat =「元素,它會中斷。我不控制Angular的版本,可能平臺是在最新版本爲1.0.6時創建的,現在很難切換到1.2版本。 – jcubic

+0

不幸的是,這超出了我的專業知識。個人而言,我會拍攝更新。你等待的時間越長,它就越難。 – Sprottenwels

+0

如果你使用'element'而不是item,那麼做'item = element' – Chandermani