Javascript 如何在Aurelia入门应用程序（导航应用程序）中使用JQuery UI组件

我能够按照入门教程中提供的步骤运行Aurelia应用程序。他们在skeleton应用程序中使用了引导导航条。可以在Aurelia应用程序中使用JQuery UI组件吗。如果是，请向我解释如何实现这一点

---

提前感谢。

您可以

导入

，然后在DOM元素上使用jquery

给定名为

test.html的
模板
：

<template>
  <div ref="content">test</div>
</template>

然后，您可以使用
标记在任何视图中使用该自定义元素

本例使用
css（）
函数，但您可以导入任何插件并将其应用于元素

请参阅此处的一个工作示例：（耐心等待，加载需要一点时间）。
是的，这是可能的

我为您制作了一个jQueryUI标签示例：

tabs.html

<template>
    <ul>
      <li repeat.for="tab of tabs">
        <a href="${'#' + $parent.id + '-' + $index}">${tab.title}</a>
      </li>
    </ul>
    <div repeat.for="tab of tabs" id="${$parent.id + '-' + $index}">
      <p>${tab.text}</p>
    </div>
</template>

代码可读性很好：我已经从config.js文件导入了jquery，也从那里导入了jquery ui（只有组件选项卡，所以它变得更轻）。然后，我将domeElement注入到我的类中，这样我就可以得到它的id。我已经创建了我的可绑定属性
tabs
。在构造函数中，我获取domeElement id并填充id属性。最后，在附加的事件上（当所有绑定都完成时），我从id中获得了jQuery对象，并调用了方法
tabs（）
，将模板转换为一个tabs组件。很简单，嗯

在我的config.js文件中，我添加了这两行：

"jquery": "github:components/jquery@2.1.4",
"jquery-ui": "github:components/jqueryui@1.11.4",

然后，通过在项目的任何其他HTML模板中调用Tabs组件，您可以在任何地方使用它：



就这样

您可以在此处看到工作示例：

PS：谢谢你的plnkr，西尔维安，我用你的来叉我的

请稍等。这是一个很好的问题，我找不到一篇关于如何做到这一点的好文章。同时，请在此处查看错误报告：。它有一个合理的例子，说明了有人如何使用datepicker插件处理这个问题。我写了一个博客，可能会让你感兴趣，关于将第三方库集成到Aurelia中：我写了一个博客，关于创建自定义元素来包装css框架：
import {bindable, inject} from 'aurelia-framework';
import $ from 'jquery';
import {tabs} from 'jquery-ui';

@inject(Element)
export class Tab {
  @bindable tabs = null;

  constructor(el) {
    this.id = el.id;
  }

  attached() {    
    $(`#${this.id}`).tabs();
  }
}

"jquery": "github:components/jquery@2.1.4",
"jquery-ui": "github:components/jqueryui@1.11.4",