Javascript Angular JS我可以只在我需要的JS上加载服务而不在app.JS中加载服务吗？

我试过这样做：

var vehicle_info = angular.module('psngr.vehicle_info', []).factory('vehicle_info', ['$rootScope', '$timeout', '$q', vehicle_info]);
var name = vehicle_info.getNameOfVclass($rootScope.data.user.vehicles[i].vclass.id);

但我明白了：

vehicle_info.getNameOfVclass is not a function
at dashboard.js?v=@@TIMESTAMP:288
at angular.js:9369
at angular.js:13189
at l.$eval (angular.js:14401)
at l.$digest (angular.js:14217)
at l.$apply (angular.js:14506)
at l (angular.js:9659)
at S (angular.js:9849)
at XMLHttpRequest.D.onload (angular.js:9790)

为什么?

在我这样做之前，在app.js文件中：

 angular.module('psngr.vehicle_info', []).factory('vehicle_info', ['$rootScope', '$timeout', '$q', vehicle_info]);
 var app = angular.module('app', ['ngRoute', 'ngAnimate', 'route-segment', 'view-segment', 'ngCookies', 'ngImgCrop', 'ngSanitize', 'psngr.payment', 'psngr.storage', 'psngr.unit', 'psngr.vehicle_info']);

其中：

 app = app.run(function($rootScope, $location, $timeout, $http, $window, storage, unit) {
    $rootScope.unit = unit;
}

但是我不希望它有一个根范围，并且是全局的，我只想在我使用它的html中加载脚本文件。所以我想在html的js文件中加载模块。可能吗

编辑：

包含该服务的vehicle_info.js文件如下所示：

 var vehicle_info = function($rootScope, $timeout, $q) {
function getNameOfVclass(vclass) {
    switch(vclass) {
        case 1:
            return i18n.t('psngr.profile.vehicle.car.midsize');
        case 2:
            return i18n.t('psngr.profile.vehicle.car.large');
        case 3:
            return i18n.t('psngr.profile.vehicle.car.compact');
        case 4:
            return i18n.t('psngr.profile.vehicle.car.scooter');
        case 5:
            return i18n.t('psngr.profile.vehicle.car.motorcycle');
        case 6:
            return i18n.t('psngr.profile.vehicle.car.suv');
        case 7:
            return i18n.t('psngr.profile.vehicle.car.van');
        case 8:
            return i18n.t('psngr.profile.vehicle.car.pickup');
        case 9:
            return i18n.t('psngr.profile.vehicle.car.truck');
        case 10:
            return i18n.t('psngr.profile.vehicle.car.bicycle');
        default:
            return i18n.t('psngr.profile.vehicle.car.midsize');
    }
}

//Exposed methods
return {
    /*  get name of vclass */
    getNameOfVclass: function(vclass) {
        return getNameOfVclass(vclass);
    },
};
};

<div ng-controller="appController">
    <p>The name of the v class is: {{ name }}</p>
</div>

---

当然可以，但在初始化服务之前不能使用它

var vehicle_info = angular.module('psngr.vehicle_info', []).factory('vehicle_info', ['$rootScope', '$timeout', '$q', vehicle_info]);
var name = vehicle_info.getNameOfVclass($rootScope.data.user.vehicles[i].vclass.id);

相反，你可以这样做。 首先定义您的服务

var vehicle_info = angular.module('psngr.vehicle_info', []).factory('vehicle_info', ['$rootScope', '$timeout', '$q']);

现在将其包含在控制器中。

---

请阅读此处

出现错误的原因：

车辆信息。getNameOfVclass不是一个函数

第一行没有做你认为它在做的事情。看起来您正试图将

vehicle\u info

工厂的实例分配给名为

vehicle\u info

的变量：

var vehicle_info = angular.module('psngr.vehicle_info', []).factory('vehicle_info', ['$rootScope', '$timeout', '$q', vehicle_info]);

这里实际发生的是您正在将

psngr.vehicle\u info

模块分配给

vehicle\u info

变量。这是因为对模块的

.factory（）

函数的调用不会返回工厂的实例，而是返回启用链接的模块。因此，在声明第一个变量后，错误在第二行变得明显：

var name = vehicle_info.getNameOfVclass($rootScope.data.user.vehicles[i].vclass.id);

这里，您正在模块上寻找一个名为

getNameOfVclass

的函数，当然它不在那里，或者正如Angular所说：getNameOfVclass不是一个函数

使用工厂实例

您必须将其注入另一个角度组件（通常是控制器），以便在其中使用它。因此，在您的情况下，您的代码可能会变成这样（我更改了名称，因为我更愿意命名它们）：

然后作为一个基本示例，在index.html中，您可以有如下内容：

 var vehicle_info = function($rootScope, $timeout, $q) {
function getNameOfVclass(vclass) {
    switch(vclass) {
        case 1:
            return i18n.t('psngr.profile.vehicle.car.midsize');
        case 2:
            return i18n.t('psngr.profile.vehicle.car.large');
        case 3:
            return i18n.t('psngr.profile.vehicle.car.compact');
        case 4:
            return i18n.t('psngr.profile.vehicle.car.scooter');
        case 5:
            return i18n.t('psngr.profile.vehicle.car.motorcycle');
        case 6:
            return i18n.t('psngr.profile.vehicle.car.suv');
        case 7:
            return i18n.t('psngr.profile.vehicle.car.van');
        case 8:
            return i18n.t('psngr.profile.vehicle.car.pickup');
        case 9:
            return i18n.t('psngr.profile.vehicle.car.truck');
        case 10:
            return i18n.t('psngr.profile.vehicle.car.bicycle');
        default:
            return i18n.t('psngr.profile.vehicle.car.midsize');
    }
}

//Exposed methods
return {
    /*  get name of vclass */
    getNameOfVclass: function(vclass) {
        return getNameOfVclass(vclass);
    },
};
};

<div ng-controller="appController">
    <p>The name of the v class is: {{ name }}</p>
</div>

v类的名称是：{{name}

---

谢谢，我会研究这个问题，这个答案非常简单，我会阅读工厂配方，并告诉你我是否会处理。很遗憾看到一些混蛋否决了这个答案，尽管它看起来很准确。希望这会有帮助。有时会发生：pI尝试使用

var vehicle\u info=angular.module（'psngr.vehicle\u info'，[]）.factory（'vehicle\u info'，['$rootScope'，'$timeout'，'$q']）但我还是遇到了同样的问题：vehicle_info.getNameOfVclass不是一个函数如果你可以在你有这个“getNameOfVclass”函数的地方共享更多的源代码，这将有助于理解确切的问题。你不必使用$rootScope，使用$scope作为本地作用域。您的服务必须是在主应用程序或通过其他模块注册的角度服务。我想这就可以完成你的任务了。我怎样才能得到这个服务的实例，这样我就可以调用getNameOfVclass了？我是个新手，我正在努力理解如何称呼它。我必须遵循的唯一示例是我在app.js中发布的，但我需要在dashboard.js文件中本地执行，因此问题我已经更新了我的答案。听起来，您试图将项目分解为几个小部分，并且非常仔细地考虑事物的归属——这正是正确的做法。在我的示例中，我将所有内容集中在一个文件中，但这不是一个好的做法。我通常会使用
app.js
来定义模块，使用
appController.js
来定义控制器，使用
vehicleInfoService.js
来定义服务。在您的示例中，dashboard.js似乎是您定义
dashboardController
的地方，而这正是您需要注入服务的地方（与我在
appController
中所做的方式大致相同）。好的，谢谢，我们来看看这个。嗯，是的，我的老板不希望我在app.js（全局）中提供所有这些服务，因为将它们放在内存中不是很好的做法，他们希望我在使用它的js文件中打开，但还没有开始工作。我开始了一个单独的项目，试图了解angular是如何工作的，当我谈到这一点时，我会让你们知道