在 AngularJS 中，你可以使用自定义函数来扩展应用程序的功能。但是，在将这些函数添加到代码中时，你需要考虑它们应该放在哪里。本文将探讨在 AngularJS 中放置用户定义的函数的最佳实践。
控制器（Controllers）
一个常见的做法是将用户定义的函数放在控制器（Controller）中。控制器负责处理与视图相关的业务逻辑，并将数据传递给视图显示。因此，将用户定义的函数放在控制器中，可以让它们与视图紧密耦合，并且更容易引用和调用。例如：
app.controller('MyController', function($scope) {
$scope.myFunction = function() {
// user-defined function logic
};
});在上面的例子中，我们将名为 "MyController" 的控制器中定义了一个名为 "myFunction" 的函数。
但是，如果你的应用程序包含多个控制器，则可能需要在其中某个控制器中定义一组公共函数，以便多个控制器都可以使用它们。这种情况下，你可能需要考虑将这些公共函数定义为服务（Services）。
服务（Services）
由于服务是单例对象，因此在多个控制器之间共享函数时，通常会将其定义为服务。服务用于在应用程序的不同部分共享代码，可以在多个控制器、指令和其他服务之间重用。例如：
app.service('MyService', function() {
this.myFunction = function() {
// user-defined function logic
};
});在上面的例子中，我们将名为 "MyService" 的服务中定义了一个名为 "myFunction" 的函数。
你也可以使用工厂（Factory）或者提供者（Provider）来定义服务，这些方法都有各自的优劣点和适用场景。
指令（Directives）
指令是 AngularJS 中最强大的功能之一，它们可以创建自定义 HTML 元素、属性、类或注释，并通过绑定到作用域中的变量或函数来扩展视图。如果你希望将自定义函数与某个特定的指令相结合，那么将函数放在指令中可能是最佳选择。例如：
-- -------------------- ---- -------
---------------------------- ---------- -
------ -
----- --------------- -------- ------ -
---------------- - ---------- -
-- ------------ -------- -----
--
-
--
---在上面的例子中，我们将名为 "myDirective" 的指令中定义了一个名为 "myFunction" 的函数。该函数可以在指令的链接函数（link function）中进行定义，以确保它只对指令所在的元素生效。
结论
在 AngularJS 应用程序中放置用户定义的函数有多种选择。你可以将它们放在控制器中，以便它们能够与视图紧密耦合；或者将它们放在服务中，以便在多个控制器之间共享；或者将它们放在指令中，以便将其与特定的 HTML 元素相关联。无论哪种方式，都需要根据应用程序的需求和代码结构来决定最佳实践。
示例代码: CodePen
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/27423