在单个页面网站中排列不同视图的最佳方式

Question

我有一个使用AngularJS和Bootstrap的应用程序。 我安排不同观点的方式是使用ng-show。也就是说，视图根据按下按钮等而改变，并启用/禁用ng-show值。

我有一个包含大量DIV的HTML文件。所有这些DIV都显示/消失。

我的问题是：

• 这是做单页网页应用的常用方法吗？即拥有不同DIV的所有视图并根据需要显示/隐藏它们？
• 是否有更有效的方法将所有不同的视图排列成更结构化的方式，而不是将所有视图都放在一个HTML文件中？

谢谢。

Answer 1

如果您的应用程序非常大并且您有两三个以上的视图，则必须使用类似ngRouter的路由器，UI路由器功能更强大但更复杂。这是最好的解决方案。

如果您的应用程序相当小（两个或三个视图），并且没有进化，则可以使用ng-switch。

Ng-if可能是一个选项，但不太方便。

但你应该避免使用ng-show，因为DOM元素总是在页面中而只是隐藏。

Answer 2

你应该真正使用路由服务，例如ngRouter或ui.router，因为如果应用程序变得更复杂，它将变得越来越难以维护。

Here's我在Google上搜索路由和使用模板的一篇文章。

Answer 3

根据菜单在angularjs中使用{{1}}，可以非常轻松地在单页应用程序上显示多个页面。

AngularJS单页模板和ng.Net模板，两者都基于mvc模式，易于理解。所以在下面有一些参考。核实。

https://visualstudiogallery.msdn.microsoft.com/5af151b2-9ed2-4809-bfe8-27566bfe7d83

https://github.com/BBird40/ng.NET

https://visualstudiogallery.msdn.microsoft.com/48d928e3-9b5c-4faf-b46f-d6baa7d9886c