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');
    }
}

此外，我已经安装了materialize-css：

jspm install npm:materialize-css

...我已在main.ts中导入了materilialize：

import materialize from 'materialize-css';

但是，只要具有material-select属性的元素尝试加载，我就会获得此控制台输出：

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

如何从Aurelia中识别出materialize-css javascript函数？

Answer 1

卸载软件包的npm版本并改为安装github版本：

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

通过安装github版本，将使用package override，并且将使用正确的依赖项（jquery + css）安装软件包。

然后你就可以做到这一点：

import $ from 'Dogfalo/materialize';

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

注意：合并this PR后，上述步骤才会生效

在Aurelia项目中找不到Materialise-css javascript函数

1 个答案: