Aurelia customAttribute 多属性传递答案

【问题标题】：Aurelia customAttribute multiple property passingAurelia customAttribute 多属性传递
【发布时间】：2015-08-24 21:18:03
【问题描述】：

我创建了一个自定义属性，它是引导工具提示的包装器

工具提示.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>

所以问题是我如何将 data-placement 和 data-original-tile 传递并绑定到 Tooltip 类中的标题和位置。当前的aurelia documentation 没有说明自定义属性的多数据绑定。

【问题讨论】：

标签： aurelia

【解决方案1】：

您可以像这样将多个选项传递给自定义属性：

<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>

【讨论】：