2015-08-24 32 views
1

我創建了一個自定義屬性,是引導提示的包裝奧裏利亞customAttribute多個屬性傳遞

tooltip.ts

import {bindable, inject, customAttribute} from "aurelia-framework"; 
import * as $ from "jquery"; 

@customAttribute("tooltip") 
@inject(Element) 
export class Tooltip { 
    element: HTMLElement; 
    @bindable title: any; 
    @bindable placement: any 

    constructor(element) { 
     this.element = element; 
    } 

    attached() { 
     $('[data-toggle="tooltip"]').tooltip(); 
    } 
} 

了header.html

<a class="toggle-link" data-toggle="tooltip" data-placement="bottom" title="" data-original-title="Click to Search"><i class="fa fa-search"></i></a> 

所以,問題是如何我將數據放置和數據原始圖塊傳遞並綁定到Tooltip類中的標題和佈局。目前的aurelia documentation沒有提到有關自定義屬性的多個數據綁定的任何內容。

回答

5

您可以通過多種選項來像這樣的自定義屬性:

<div tooltip="placement: 'bottom'; originalTitle: 'Click to Search'"></div> 

請檢查文檔如何實現上述的解釋。這些信息就在您鏈接到的地點的下方。

這就是說你的情況可能通過自定義元素更好地完成。然後您的標記可能如下所示:

<tooltip class="toggle-link" placement="bottom" original-title="Click to Search"> 
    <i class="fa fa-search"></i> 
</tooltip>