在 Ember.js 单页应用程序 (SPA) 中，控制器 (Controller) 是处理业务逻辑的主要组件之一。控制器充当了数据模型和视图之间的桥梁，负责将数据从模型传递到视图，并处理视图中的用户交互事件。
在本文中，我们将深入介绍 Ember.js 控制器的使用方法，包括如何创建控制器、如何在控制器中处理用户交互事件、如何使用控制器来管理状态和数据等方面。我们还将提供示例代码，帮助您更好地理解控制器的使用方法。
创建控制器
在 Ember.js 中，您可以使用 ember generate controller 命令来创建一个新的控制器。该命令将为您创建一个名为 xxx-controller.js 的文件，其中 xxx 是您指定的控制器名称。例如，如果您要创建一个名为 user 的控制器，可以使用以下命令：
ember generate controller user
该命令将为您创建一个名为 user-controller.js 的文件，其中包含一个名为 UserController 的控制器类。您可以在该类中定义处理业务逻辑的方法。
处理用户交互事件
在 Ember.js 中，您可以使用控制器来处理视图中的用户交互事件。例如，如果您有一个名为 login 的模板和控制器，您可以在控制器中定义一个 login 方法来处理登录按钮的点击事件：
-- -------------------- ---- -------
-- -----------------------------------
------ ---------- ---- --------------------
------ ------- -------------------
-------- -
------- -
-- ------
-
-
---在上面的示例中，我们在控制器中定义了一个名为 login 的方法，并将其添加到 actions 对象中。该方法将在用户单击登录按钮时被调用。
管理状态和数据
控制器还可以用于管理状态和数据。例如，如果您有一个名为 user 的控制器，您可以在其中定义一个 isLoggedIn 属性来跟踪用户的登录状态：
-- -------------------- ---- -------
-- ----------------------------------
------ ---------- ---- --------------------
------ ------- -------------------
----------- ------
-------- -
------- -
-- ------
---------------------- ------
--
-------- -
-- ------
---------------------- -------
-
-
---在上面的示例中，我们在控制器中定义了一个名为 isLoggedIn 的属性，并在 login 和 logout 方法中使用 set 方法来更改该属性的值。这可以让我们在视图中使用 {{if}} 帮助器来显示或隐藏特定的元素，例如显示登录表单或用户资料。
-- -------------------- ---- -------
----- ------------
---------- ----- ------------------
------- -------- --------------------------
--------
----- -------- ----------
------ ----------- ----------------
------ --------------- ----------------
------- ----------------------------
-------
-------在上面的示例中，我们使用 {{if}} 帮助器来检查 isLoggedIn 属性的值。如果该属性为 true，则显示欢迎信息和注销按钮；否则，显示登录表单。
结论
在本文中，我们介绍了 Ember.js 控制器的基本用法，包括如何创建控制器、如何在控制器中处理用户交互事件、如何使用控制器来管理状态和数据等方面。我们还提供了示例代码，帮助您更好地理解控制器的使用方法。希望这篇文章能帮助您更好地使用 Ember.js 开发单页应用程序。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6746f885e504cb428eccbd85