Javascript 如何在AngularJS ng click（或ng change，…）中调用服务函数？

调用这样的函数时：

HTML:

这一切都很完美，但当我的函数在服务中（控制器可以访问）时，该函数不会被调用。通过将服务名称作为前缀来调用它也不是一个选项（即使这在javascript代码本身中有效）

myService.myFunction（var）

所以我的问题是：当服务位于服务中时，在ng change中调用服务的正确方式是什么

---

提前感谢

您需要通过作用域使用函数调用服务函数。因此，在您的示例中，您可以在作用域的myfunction方法中调用服务方法，前提是将您的服务注入到控制器中

$scope.myFunction = function(var){

   myService.myFunction(var);    
}

---

请始终记住，UI中只有在$scope中定义的属性可用，而不是您的服务

虽然Whizkids的答案在技术上是正确的，但我认为通过将整个服务直接附加到作用域来将其公开给视图没有问题。然而，这取决于项目的复杂性和服务的设计

例如，我编写的与可重用视图状态相关的大多数服务只是一组函数，其中一个函数公开底层数据

return {
    getData: function() { return container; },
    doSomethingOnData: function() { /* some manipulation of container */ }
};

现在，只需将服务数据附加到

$scope

变量即可访问服务数据：

$scope.serviceData = MyService.getData();

因此，访问服务函数的选项是要么使用Whizkids应答并创建附加到作用域的包装函数，要么直接向视图公开服务

$scope.$MyService = MyService;

您可以对其执行以下操作：

<div ng-click="$MyService.doSomethingOnData()"></div>

---

虽然这种做法严格违反了angulars分离原则，但如果您的服务中有许多函数需要使用简单的包装器公开，那么它确实会使代码简洁。

谢谢。但是，如果您还需要在控制器中创建函数，那么拥有服务的意义是什么呢？几乎没有节省空间？服务并不意味着节省空间。它们是应用程序中的单例实例，可以被其他控制器、服务等访问。我们的想法是将视图与JS代码的其余部分分离。只有需要向UI公开的函数/变量才会添加到$scope.Ok。谢谢你的解释

$scope.$MyService = MyService;

<div ng-click="$MyService.doSomethingOnData()"></div>