基本的自定義元素似乎沒有工作

我想爲我的Aurelia應用程序創建一個標準的用戶狀態小部件，但我不確定我在做什麼錯誤。作爲一個起點，我遵循the docs，但是我的結果並不是他們告訴我的期望，我也沒有在構建或瀏覽器中看到錯誤。基本的自定義元素似乎沒有工作

相關文件如下：

<!-- nav-bar.html --> 
<template bindable='router'> 
    <require from="./user-status "></require> 
    <!-- various nav buttons --> 
    <p class="navbar-collapse collapse navbar-text"> 
     Test <user-status></user-status> 
     </p>

用戶status.html

<template> 
    ${status} 
</template>

用戶status.js

export default class UserStatusCustomElement { 
     constructor() { 
     this.status = 'Be sure to drink your Ovaltine!'; 
     } 
    }

如果我改變nav-bar.html的要求看對於./user-status.html它似乎有效果（額外aurelia-看起來屬性是廣告ded到呈現的html中的用戶狀態元素），但不呈現消息（假定b/c不是拾取類並呈現爲僅html的東西）。如果我按原樣離開，它不會出錯，但這些屬性不會被添加，也不會顯示任何內容，甚至是靜態文本。

來源

2017-02-18 Paul

是否有可能由於'from =「./ user-status」'中的額外空間而發生問題？也許嘗試將它改爲'from =「./ user-status」'？這看起來可能是一個非常愚蠢的建議，但是由於'repeat-for'迭代器中的空間，我面臨了一些問題。 –

另一個建議是，如果你只想使用html，那麼使'status''bindable'（就像''nav-bar'爲'router'完成的那樣），並且綁定來自'nav-bar'的屬性。 –

從'user-status.js'中刪除'default'關鍵字。 –

我玩過你的代碼，發現從user-status.js模塊中刪除default修復了這個問題。我懷疑原因與Aurelia在導入模塊時如何利用模塊加載器（System.js，webpack，...）有關。不幸的是，我對奧裏利亞的內部知識不夠深入，沒有給出更深入的答案。

來源

2017-02-18 18:36:46

謝謝，我實際上讀了一些關於導入/導出的東西，我認爲這更正確的說它是關於Aurelia如何導入視圖模型（獨立於模塊加載器）。他們希望支持導入沒有默認導出的文件，因此他們必須導入所有內容，然後假定導出的第一個內容是視圖模型。從我可以告訴，做這不符合默認的導出/默認導入語法。也就是說，如果有人比我更聰明，我會提出一個錯誤來解決這個問題。 :) – Paul

基本的自定義元素似乎沒有工作

回答

相關問題