物化-css javascript函数在Aurelia项目中找不到。

Question

我创建了一个自定义属性来控制materilaize select元素的生命周期：

import {customAttribute} from 'aurelia-templating';
import {inject} from 'aurelia-dependency-injection';

@customAttribute('material-select')
@inject(Element)
export class MaterialSelect {
    element: Element = null;

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

    attached() {
        console.log("ATTACHED");
        console.log(`The attached element is: ${this.element}`);
        $(this.element).material_select();
    }

    detached() {
        console.log("DETACHED");
        $(this.element).material_select('destroy');
    }
}

此外，我还在以下几个方面安装了物化css：

jspm install npm:materialize-css

..。我在main.ts中引入了以下几种材料：

import materialize from 'materialize-css';

但是，每当带有material-select属性的元素试图加载时，我都会得到以下控制台输出：

ATTACHED
The attached element is: [object HTMLSelectElement]
Uncaught TypeError: $(...).material_select is not a function

如何从Aurelia内部识别物化-css javascript函数？

Answer 1

卸载软件包的npm版本，然后安装github版本：

jspm uninstall npm:materialize-css
jspm install github:Dogfalo/materialize

通过安装github版本，将使用包覆盖，并使用正确的依赖项(jquery + css)安装包。

然后你就能做到这一点：

import $ from 'Dogfalo/materialize';

$('.foo').material_select();

注意:在https://github.com/jspm/registry/pull/650合并之前，上述步骤将无法工作。