Aurelia動態添加引導選項卡

在我的aurelia應用程序中，我有一個基於導航欄的菜單系統和引導選項卡。每當我選擇一個菜單項時，一個新窗格會被附加到該選項卡上，顯示屬於所選菜單項的內容/視圖。我從服務器（MVC）獲取內容/視圖。Aurelia動態添加引導選項卡

$('.tab-content').append(`<div class="tab-pane" id="tab${menuItem.id}" role="tabpanel"></div>`); 
    ... // fetch view from server 
    $(tab).html('fetched content');

只要'抓取的內容'是純字符串，這工作正常。然而，一旦我取一個奧裏利亞視圖（如「

<template>some content</template>

」），則瀏覽器包取出的內容以‘＃文檔片段’和沒有示出的內容。

我是Aurelia的新手，所以我懷疑我缺少一些基本的東西。我需要做些什麼來完成這項工作？

P.S.設置html後，我也嘗試過增強模板引擎，但無濟於事。

來源

2017-01-13 bluewater

增強應該有效，但無論它是否有效，我認爲你應該避免從服務器獲取組件。服務器和客戶端應該是相互獨立的。 –

爲什麼你使用jQuery來附加HTML而不是使用Aurelia來做到這一點？ –

經過相當多的頭部劃傷之後，我意識到這兩個評論都指向了正確的方向，而且我的方法有缺陷。兩個帳戶有缺陷：首先，我直接添加DOM元素（選項卡窗格）而不是添加到視圖模型並讓Aurelia處理繁重的操作，從而違反了MVVM概念。其次，我試圖繞過Aurelia的路由機制，直接進入服務器並從那裏獲取我的視圖。難怪我遇到了問題......我已經回到了繪圖板。

Thx爲您的支持，夥計。

來源

2017-01-15 06:54:46 bluewater

P.S. https://gist.run/?id=b3df9d740a3cf3d31098c83c9ffe8614顯示了我正在努力工作的情況。 – bluewater

Aurelia動態添加引導選項卡

回答

相關問題