如何防止在Ember.js被破壞的觀點

我不相信這是Ember.js: Prevent destroying of views重複。我發現的其他相關問題已過時。

如果後來變得過時，我使用Ember 1.7.0和Handlebars 1.3.0。

語境的問題：

正如標題狀態，我想知道如何在不破壞他們的觀點之間轉換。用queryParams做不是解決我的問題。

我創建具有以下嵌套視圖計算器：

>>Calculator View 
    >>Report View (hasMany relationship to Calculator) 
     --School Partial (I am using queryParams here)

我能夠在Report意見就好了不會破壞我的School部分之間進行導航，因爲我使用queryParams和使用displaySchoolPartial布爾值顯示/隱藏部分。下面的示例：

報告模板（剝離，只顯示重要組成部分）：

<script type="text/x-handlebars" data-template-name="calculator/report"> 
    ... 
    {{#link-to "calculator.report" (query-parameters displaySchoolPartial="true")}} 
    {{render "_school"}} 
</script>

學校模板（也剝了下來）：

<script type="text/x-handlebars" data-template-name="_school"> 
    {{#with controllers.calculatorReport}} 
    <div {{bind-attr class=":schoolPartialWrapper displaySchoolPartial::hide-element"}}> 
     ... 
    </div> 
    {{/with}} 
</script>

可正常工作。如前所述，在不同的Report視圖和School部分之間導航不會破壞視圖。

問題：導航到Calculator視圖時

我的問題來了，Report視圖被破壞，然後破壞了我的School視圖。我不想也用queryParams來取代我的Report的意見。

我需要確保視圖不被破壞的原因是因爲我在School部分中有3000個學校的選擇框。重新渲染它需要很長的時間。簡單地顯示/隱藏Report視圖將會是一個更好的用戶體驗。

來源

2014-09-11 jperezov

我的建議是不使用「渲染」，而是使用「部分」，所以你只需要放入你想要的模板。有一個控制變量設置顯示/隱藏通過CSS類。並使用你的控制器來控制這個變量。

使用「部分」將允許你有獨立於報告的學校模板，從而移除報告不會影響學校。

只要確保您正確定義出口和部分。

希望它有幫助！

來源

2014-09-12 07:30:08 LanNguyen

不要與Ember戰鬥。你會輸的。

視圖在需要時被實例化和渲染，並在完成時被拆除。

爲什麼你有一個3000元素的下拉列表呢？

如果你確實想要這樣做，我會建議在你的應用程序頁面上放一個{{render}}，並隱藏它。該視圖將在應用程序啓動時創建並呈現，並且只要應用程序處於活動狀態，該視圖就會一直存在。然後，在您的視圖的didInsertElement中，執行該隱藏元素的cloneNode並將其插入視圖的DOM某處。您可能不得不糾正讓事件處理程序正確連線。

來源

2014-09-12 08:02:49

我同意你的第一句話100％。我已經改變了我的實現。我只是想出於好奇而想知道。 – jperezov 2014-09-12 11:51:33

儘管關於「{{render}}」的使用，我已經在'School'部分使用了它。如果我將它用於「Report」部分，我將如何定義路線？它是否在通常的'App.Router.map'函數中工作？ – jperezov 2014-09-12 11:52:36

如何防止在Ember.js被破壞的觀點

回答

相關問題