Aurelia customAttribute無法正常工作

Question

我有customAttribute的問題。 我想用它來插入jquery-ui datepicker。 從這里獲取的想法： http ： //www.danyow.net/jquery-ui-datepicker-with-aurelia/

然而，看起來它根本不起作用。 我試圖調試應用程序，看起來像attach@datePicker.js根本沒有被解雇。 但是，正在從服務器請求文件本身。 最糟糕的是我昨天晚上工作了，但今天早上......

我在我的骨架應用程序分支中創建了一個簡單的示例： https ： //github.com/Exsilium122/skeleton-navigation，因此可以克隆並運行以進行故障排除。

最重要的兩個文件：

---

welcome.html

<template>
  <require from="./resources/datepicker"></require>
  <input id="myDate" datepicker="datepicker" value.bind="timestamp | dateFormat"/>
</template>

---

datepicker.js

import {inject, customAttribute} from 'aurelia-framework';
import 'jquery-ui';
import 'jquery-ui/themes/cupertino/jquery-ui.css!';

@customAttribute('datepicker')
@inject(Element)
export class Datepicker {
    constructor(element) {
        this.element = element;
    }

    attached = () => {
        console.log("attached Datepicker");
        $(this.element).datepicker({
            dateFormat: 'mm/dd/yy'
        }).on('change', e => fireEvent(e.target, 'input'));

    }

    detached = () => {
        console.log("detached Datepicker");
        $(this.element).datepicker('destroy').off('change');
    }
}

function createEvent(name) {
    var event = document.createEvent('Event');
    event.initEvent(name, true, true);
    return event;
}

function fireEvent(element, name) {
    var event = createEvent(name);
    element.dispatchEvent(event);
}

---

並且控制台很干凈：

DEBUG [aurelia]加載插件http：// localhost：9000/jspm_packages/github/aurelia/templating-binding@0.16.1 。 aurelia-logging-console.js：38 DEBUG [aurelia]配置的插件http：// localhost：9000/jspm_packages/github/aurelia/templating-binding@0.16.1 。 aurelia-logging-console.js：38 DEBUG [aurelia]加載插件http：// localhost：9000/jspm_packages/github/aurelia/templating-resources@0.16.1 。 aurelia-logging-console.js：38 DEBUG [aurelia]配置的插件http：// localhost：9000/jspm_packages/github/aurelia/templating-resources@0.16.1 。 aurelia-logging-console.js：38 DEBUG [aurelia]加載插件http：// localhost：9000/jspm_packages/github/aurelia/history-browser@0.9.0 。 aurelia-logging-console.js：38 DEBUG [aurelia]配置的插件http：// localhost：9000/jspm_packages/github/aurelia/history-browser@0.9.0 。 aurelia-logging-console.js：38 DEBUG [aurelia]加載插件http：// localhost：9000/jspm_packages/github/aurelia/templating-router@0.17.0 。 aurelia-logging-console.js：38 DEBUG [aurelia]已配置的插件http：// localhost：9000/jspm_packages/github/aurelia/templating-router@0.17.0 。 aurelia-logging-console.js：38 DEBUG [aurelia]加載插件http：// localhost：9000/jspm_packages/github/aurelia/event-aggregator@0.9.0 。 aurelia-logging-console.js：38 DEBUG [aurelia]配置的插件http：// localhost：9000/jspm_packages/github/aurelia/event-aggregator@0.9.0 。 aurelia-logging-console.js：38 DEBUG [aurelia]加載插件資源/索引。 aurelia-logging-console.js：38 DEBUG [aurelia]配置的插件資源/索引。 aurelia-logging-console.js：46 INFO [aurelia] Aurelia啟動aurelia-logging-console.js：38 DEBUG [模板]導入資源http：// localhost：9000 / dist / app.html [“nav-bar。 html“，”bootstrap / css / bootstrap.css“] aurelia-logging-console.js：38 DEBUG [模板]導入資源http：// localhost：9000 / dist / nav-bar.html [] aurelia-logging- console.js：38 DEBUG [模板]導入http：// localhost：9000 / dist / welcome.html [“ http：// localhost：9000 / dist / resources / datepicker ”]的資源

Answer 1

attached = () => {需要更改為attached() { ，如gitter中所述。

detached方法需要相應的變化。

這個問題可以被關閉 - OP在aurelia gitter中解決了問題。

Answer 2

剛做了一個：

• 克隆你的回購
• npm install jspm
• npm安裝
• jspm install -y

你猜怎么着。 有用 ：）

http://imagebin.ca/v/2KV4cFzITHtX