AngularJS 是一个用于构建动态 web 应用程序的 JavaScript 框架。在使用 AngularJS 进行开发时，切换视图是一个经常要处理的任务。本文将介绍如何在 AngularJS 控制器函数中切换视图，并提供详细的步骤和示例代码。
步骤
1. 首先，确保你已经安装了 AngularJS 并在应用程序中引入了相关的库文件。
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.2/angular.min.js"></script>
2. 创建一个包含两个视图的 HTML 文件。
在这个示例中，我们将创建一个包含两个简单视图的 HTML 文件：一个登录页面和一个欢迎页面。
-- -------------------- ---- -------
--------- -----
----- --------- ---------------
------
----- ----------------
---------------- ---- --------- ---------------
------- ------------------------------------------------------------------------------------
------- ----------------------
-------
----- -----------------------
---- --------------------
--------- ---------
------- ----------------------------------- -- ------- -------------
------
---- --------------------
----------- ---------
------- --------------------------------- -- ----- -------------
------
-------
-------3. 创建一个 AngularJS 应用程序，并定义控制器函数。
在这个示例中，我们将创建一个名为 "myApp" 的 AngularJS 应用程序，并定义一个名为 "myCtrl" 的控制器函数。该控制器函数将包含一个名为 "switchToWelcome" 的函数和一个名为 "switchToLogin" 的函数。这两个函数将负责在视图之间进行切换。
-- -------------------- ---- -------
--- --- - ----------------------- ----
------------------------ -------- -------- -
---------------- - -----
---------------------- - -------- -- -
---------------- - ------
--
-------------------- - -------- -- -
---------------- - -----
--
---解释
在上面的代码中，我们使用了 AngularJS 的 ng-show 和 ng-hide 指令来显示或隐藏登录页面和欢迎页面。当 showLogin 变量为 true 时，登录页面将被显示；反之，欢迎页面将被显示。
在控制器函数中，我们首先将 showLogin 设置为 true，以确保在应用程序启动时显示登录页面。然后，我们定义了 switchToWelcome 函数和 switchToLogin 函数。这两个函数都使用了 $scope 对象，该对象是 AngularJS 的核心组件之一。$scope 用于在控制器和视图之间共享数据和方法。
switchToWelcome 函数将 showLogin 设置为 false，从而切换到欢迎页面。switchToLogin 函数将 showLogin 设置为 true，从而切换回登录页面。
示例代码
完整的示例代码如下所示：
-- -------------------- ---- -------
--------- -----
----- --------- ---------------
------
----- ----------------
---------------- ---- --------- ---------------
------- ------------------------------------------------------------------------------------
------- ----------------------
-------
----- -----------------------
---- --------------------
--------- ---------
------- ----------------------------------- -- ------- -------------
------
---- --------------------
----------- ---------
------- --------------------------------- -- ----- -------------
------
-------
-------var app = angular.module('myApp', []);
> 来源：[JavaScript中文网](https://www.javascriptcn.com/post/25031) ，转载请注明来源
[https://www.javascriptcn.com/post/25031](https://www.javascriptcn.com/post/25031)