在单独的文件AngularJS服务 [英] AngularJS service in separate file

查看:123
本文介绍了在单独的文件AngularJS服务的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的app.js包含

var app = angular.module('myApp', []).
config(['$routeProvider', function ($routeProvider, $http) {
    ...
}]);

服务看起来像

app.service('MyService', function () {
    addNums = function (text) {
        return text + "123";
    }
});

和中位指示我有

function adminCtrl ($scope, MyService) {
    $scope.txt = MyService.addNums("abc");
};

他们都在不同的文件。问题是,我得到一个错误
未知提供商:MyServiceProvider< - 为MyService

看起来像我做错了什么。

Looks like I'm doing something wrong.

推荐答案

如果你忘了告诉角度来加载您对myApp模块可能会出现提供程序错误。例如,你在你的index.html文件有这样的:

The provider error can occur if you forgot to tell Angular to load your myApp module. E.g., do you have this in your index.html file?:

<html ng-app="myApp">

您服务缺少这一点。

this.addNums = function(text) {

小提琴

有似乎是在角社区很多混乱有关何时使用VS厂家服务()(),以及如何正确code他们。所以,这里是我的简短的教程:

There seems to be a lot of confusion in the Angular community about when to use service() vs factory(), and how to properly code them. So, here's my brief tutorial:

借助 service()方法.COM / javatutors / oopjs2.shtml> JavaScript构造函数。使用服务()许多角code示例包含code这不是一个构造函数。通常情况下,他们返回一个对象,哪种违背了使用服务()&MDASH的目的;更多关于低于。如果一个对象需要被创建并返回,然后工厂()可以用来代替。通常情况下,一个构造函数是所有需要,并且可以使用服务()

The service() method expects a JavaScript constructor function. Many Angular code examples that use service() contain code that is not a constructor function. Often, they return an object, which kind of defeats the purpose of using service() — more about that below. If an object needs to be created and returned, then factory() can be used instead. Often, a constructor function is all that is needed, and service() can be used.

下面的报价是来自不同AngularJS谷歌组帖子:

The quotes below are from different AngularJS Google Group posts:

使用工厂()与服务()之间的主要区别是,工厂()
  必须返回一个对象,而服务()不返回任何东西,但它
  必须是一个对象构造函数。

The main difference between using factory() vs service() is that factory() must return an object, while service() doesn't return anything but it must be an object constructor function.

使用厂(),如果您所提供的功能,建立你的对象
  想。即,角将主要做的结果
  OBJ = myFactory()
  结果得到的obj。如果您所提供的功能是使用服务()
  您需要的对象的构造函数。即,角将主要做的结果
  OBJ =新为myService()
  结果拿到/实例obj的。

Use factory() if the function you are providing builds the object you want. I.e., Angular will essentially do
obj = myFactory()
to get the obj. Use service() if the function you are providing is a constructor for the object you want. I.e., Angular will essentially do
obj = new myService()
to get/instantiate the obj.

所以,当人们使用的服务()和code返回S一个对象,它是一种由于的方式JavaScript的浪费新作品:新将首先创建一个全新的JavaScript对象(当时做的东西有原型,然后调用由为myService()等函数定义 - 我们真的不关心这里详细说明),但是由于为myService()定义的函数将返回自己的对象,新呢一些投标奇怪:它扔掉的对象只是花费的时间创建并返回该为myService()函数创建的对象,因而有浪费

So when people use service() and its code "return"s an object, it is kind of a waste because of the way JavaScript "new" works: "new" will first create a brand new JavaScript object (then do stuff with prototype, then call the function defined by myService(), etc. -- details we don't really care about here), but because the function defined by myService() returns its own object, "new" does something a bid odd: it throws away the object is just spent time creating and returns the object that the myService() function created, hence the "waste".

一个该服务()中引入的一个原因是,以方便
  用经典面向对象的技术,如定义你的服务为
  CoffeeScript的类。

One of the reasons that service() was introduced was to make it easy to use "classical" OO techniques, such as defining your service as a coffeescript class.

此外,对服务的无证命名惯例似乎与小写的首字母来驼峰:例如,为myService

Also, the undocumented naming convention for services seems to be camelCase with first letter lowercased: e.g., myService.

这篇关于在单独的文件AngularJS服务的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆