时间戳

首页 > 解决方案 > 未捕获的错误：[$injector:nomod] 而 Angularjs 将代码分离为控制器和服务文件

javascript - 未捕获的错误：[$injector:nomod] 而 Angularjs 将代码分离为控制器和服务文件

问题描述

我正在尝试将代码拆分为控制器和服务文件，如下所示。

模块.js

    /// <reference path="../angular.js" />
    /// <reference path="../angular-resource.js" />
    var IM_Mod_app;
    (function () {
  //   IM_Mod_app = angular.module('IM_ng_app', []);
    IM_Mod_app = angular.module('IM_ng_app', ['IM_Mod_app.controllers']);
})();

控制器.js

    /// <reference path="../angular.js" />
    /// <reference path="../angular-resource.js" />
    /// <reference path="module.js" />
    /// <reference path="service.js" />

   // angular.module('IM_Mod_app.controllers', []);
    angular.module('IM_Mod_app.controllers').controller('IM_Ctrl', ['$scope', '$http', 'MaintenanceService', function ($scope, $http, MaintenanceService) {

        IM_Ctrl.$inject = ['$scope', '$http']; var PlantId = "DFC";

        loadRecords();

            function loadRecords() {

                var promiseGet = MaintenanceService.GetAllFlavors();

                promiseGet.then(function successCallback(response) {
                    alert(response.data);
                    $scope.flavours = response.data;
                }, function errorCallback(response) {      
                });
            }

            function onFlavorChange() {
                var promiseonchange = MaintenanceService.onchangeflr();

                promiseonchange.then(function successCallback(response) {
                   // alert(response.data);
                    $scope.items = response.data;
                }, function errorCallback(response) {  });
            }
        }]);

服务.js：

/// <reference path="../angular.js" />
/// <reference path="../angular-resource.js" />
/// <reference path="module.js" />
/// <reference path="controller.js" />

IM_Mod_app.service("MaintenanceService", function ($http) {

    this.GetAllFlavors = function () {
        //alert("service");
        return $http({
            method: 'GET',
            url: 'http://localhost:55762/api/ItemMaintenance/GetAllFlavors',
            params: { Plant_Id: "DFC" }
        })
    }

    this.onchangeflr = function () {
        $http({
            method: 'GET',
            url: 'http://localhost:55762/api/ItemMaintenance/GetAllFilteredItems',
            params: { Plant_Id: PlantId, Flavor_Id: flv, Variant_Id: '', Brand_Id: '' }
        })
    }
});

<body ng-app="IM_ng_app">
    <table ng-controller="IM_Ctrl">
        <tr>
            <td>
                <select ng-model="flv" ng-options="flv.FLAVOR_ID for flv in flavours" ng-change="onFlavorChange(flv.FLAVOR_ID)">
                    <option value="">Select Flavor</option>
                </select>
</td>
</tr>
</table>
</body>

Service.js:6 Uncaught ReferenceError: IM_Mod_app is not defined at Service.js:6

获取错误消息为：

“angular.js:138 未捕获错误：[$injector:nomod] 模块 'IM_Mod_app.controllers' 不可用！您拼错了模块名称或忘记加载它。”

标签： javascriptangularjsangularjs-serviceangularjs-controllerangular-module

解决方案

我想你错过了一些注射。

在应用程序模块。

IM_Mod_app = angular.module('IM_ng_app', ['IM_Mod_app.controllers']); }

在控制器上（在 $http 之后）

angular.module('IM_Mod_app.controllers', []).controller('IM_Ctrl', ['$scope', '$http', 'MaintenanceService', function ($scope, $http, MaintenanceService) {

推荐阅读