ui-router：命名視圖（多個）視圖，保持一切解耦？

我剛開始用UI的路由器和我創建的組件（角1.5），並使用新的組件的方法在這裏說明，但它不應該的問題 - http://angular-ui.github.io/ui-router/1.0.0-alpha.5/interfaces/ng1.ng1viewdeclaration.html#component ui-router：命名視圖（多個）視圖，保持一切解耦？

我想我需要看的絕對和我的國家的相對意見。讓我畫我的問題的圖片，可能更好的解釋。

我有一些高級別的組件（使用角度爲1.5的組件）。一些高級組件有子組件，但我不想將這些東西緊密結合在一起。

因此，以搜索組件爲例，它在此搜索組件內依賴於歷史記錄項目和已保存的項目。歷史項目和保存的項目都是子組件。已保存的物品還有2個孩子：雲物品和當地物品。

所以在搜索組件中，我不想緊緊地將它與子組件緊密結合，因爲我可以在沒有子組件的情況下使用搜索組件，所以我想過使用相對視圖。

我可以放置2×

<div ui-view></div>

在搜索組件

和2×

<div ui-view></div>

中保存的內容。

但它只是感覺錯了，我沒有特別緊密地與特定的視圖名稱耦合，但仍然搜索組件期望2個孩子和保存的項目也期望2也，情況可能並非如此。

我真的很感謝任何人都可以提供的見解。

也許我正在過度使用它，並使組件太小？但我希望他們能更好地合作，從技術上說，搜索可以沒有孩子就存在。

有沒有人有一些例子或建議？

感謝

來源

2016-06-10 Martin

既然你是基於你的應用程序的組件，你是否考慮使用組件路由器呢？ https://docs.angularjs.org/guide/component-router – cbass

如果我理解正確你的問題，你可能想要做的就是限制你的父母組件指令作爲Elementrestrict:'E'，並添加子組件作爲該指令的屬性限制它們作爲一個屬性restrict:'A'

和使用指令的指令和邏輯函數來處理孩子的指令

因此，最終的指令應該是這個樣子

<ui-view newattr1 newattr2></ui-view>

其中ui-view將是您的父組件，newattr1，newattr2將是子組件。如果您的子組件中沒有任何子組件，則可以使用子組件的相應鏈接功能。

來源

2016-06-13 05:09:08 Pushpendra

做到這一點的一種方法（如果我正確地理解了這個問題），即使它可能感覺像是一種解決方法，也會創建多個共享相同邏輯的組件。

var setup = { 
    controller: searchController, 
    bindings: { 
    a: '=', 
    b: '<', 
    c: '@' 
    } 
}; 

angular.module('app') 
    .component('search', angular.extend(setup, { 
    templateUrl: 'search.html' 
    })) 
    .component('searchWithChildren', angular.extend(setup, { 
    templateUrl: 'search-with-children.html' 
    })); 

var searchController() { 
    ...

來源

2016-06-15 22:52:16 Rusty

我可能不理解你的問題，但我有什麼，你可以有一個可以作爲一個抽象層的中間部分。

如果組件並沒有真正緊耦合（這似乎是關於你的搜索組件和你的歷史記錄的情況下），你可以簡單地做這樣的事情在你的「更高級別的組件」

<!-- We're inside an higher component with some data initialization --> 
<!-- passing data by references, this way both component use the same data --> 
<search-cmpt search-terms="searchTermsFromHigher"/> 
<history filter-terms="searchTermsFromHigher"/> 
<div ui-router></div> <!-- in which you resolve another component not tightly coupled -->

在我看來，關鍵問題不在於如何組織組件，而在於如何在它們之間傳遞數據。我對嗎？如果是這種情況，您可能會考慮以不同的方式管理您的前端狀態，而您實際上正在執行此操作。

注：有可能我沒有正確地得到問題。

來源

2016-06-16 17:55:51 mfrachet

我會遠離在搜索組件中使用任何視圖。否則，您將強迫其消費者瞭解其狀態以激活其2個孩子。

我有一個印象，你超過它。只要它的孩子是特定的，這意味着他們沒有在其他地方使用，我沒有看到任何錯誤顯式聲明他們的父組件。

來源

2016-06-17 17:45:54

ui-router：命名視圖（多個）視圖，保持一切解耦？

回答

相關問題