Angular 切换视图

Question

所以我对 Angular 有点陌生，我想知道如果我希望能够完全切换内容，最佳做法是什么。这样您就可以查看它，或者关闭它以隐藏它。整理一下。我应该使用 if 语句，还是给内容两侧（一个是空的）并能够在它们之间切换？什么最好？

Answer 1

angular 中的视图切换可以通过多种方式完成。为了进行基于路由的切换（基于 url 中的哈希进行切换）。使用 ngRoute 模块的组合，它可以帮助您通过使用 $routeProvider 和 ngView 指令来配置路由。

$routeProvider 文档：

https://docs.angularjs.org/api/ngRoute/provider/$routeProvider

ng查看文档：

https://docs.angularjs.org/api/ngRoute/directive/ngView

您还可以通过这些指令hide/show、add/remove内容

ngIf - 将完全删除并销毁范围内的内容

https://docs.angularjs.org/api/ng/directive/ngIf

ngSwitch - 将类似于 javascript 中的 switch 语句。这与 ngSwitchWhen 和 ngSwitchDefault 结合使用。与 ngIf 指令一样，这也会删除和破坏内容的范围。

ngSwitch/ngSwitchWhen/ngSwitchDefault

https://docs.angularjs.org/api/ng/directive/ngSwitch

ngHide/ngShow - 根据名称，这些指令将简单地分别切换 类 ng-hide 和 ng-show。 ng-hide 有一个 css 属性 显示：none.

ngShow:

https://docs.angularjs.org/api/ng/directive/ngShow

ng隐藏:

https://docs.angularjs.org/api/ng/directive/ngHide

完全删除内容的指令可以更好地提高性能，因为您的应用程序中的观察者数量可以相当快地积累。在大多数情况下，我建议对任何对其下的范围进行评估的内容使用基于删除的指令，并使用 hide/show 指令进行简单的静态内容显示。

在我包含的所有文档链接中都有这些指令中的每一个的示例用法。有问题欢迎评论。