Question

我有一个抱怨

的自定义属性“datepicker”

TypeError: $(...).datepicker is not a function

我使用skeleton-typescript-webpack作为我的起点。

datepicker.ts

import {inject, autoinject, customAttribute, DOM} from "aurelia-framework";
import moment from "moment";

import "jquery";
import "jquery-ui";

@customAttribute("datepicker")
@inject(DOM.Element)
export class JqueryUiDatePicker {
    constructor(private element: Element) {
    moment().format();
    }

    attached() {
        $(this.element)
            .datepicker({dateFormat: "DD/MM/YYYY"})
            .on("change", e => this.fireEvent((e.target) as Element, "input"));
    }

    detached() {
        $(this.element)
            .datepicker("destroy")
            .off("change");
    }

    private fireEvent(element: Element, name: string): void {
        const event = this.createEvent(name);
        this.element.dispatchEvent(event);
    }

    private createEvent(name: string): Event {
        const event = document.createEvent("Event");
        event.initEvent(name, true, true);
        return event;
    }
}

标记

<input class="form-control" id="orderDate" datepicker placeholder="Order Date" type="text" value.bind="model.orderDate | dateFormat: 'DD/MM/YYYY'">

当Aurelia处于测试阶段时，它曾经工作过，但在我使用最新的skeleton-typescript-webpack更新了我的代码后，它停止了工作。

Answer 1

尝试import $ from 'jquery';。

以下是相关示例的博客：http://davismj.me/blog/semantic-custom-element/

Answer 2

我正在使用au cli（带打字稿）...所以YMMV;但以下导入对我有用

 import * as $ from 'jquery'

是的，您还需要导入jquery-ui

Aurelia Webpack datepicker不是一个功能

2 个答案: