Question

您好我在一个名为main.js

的文件中定义了以下模块，路径和控制器

   var mainApp = angular.module("mainApp", ["ngRoute", "ngResource", "ui"]).
    config(function ($routeProvider) {
        $routeProvider.
            when('/addEmp', { controller: EmpCtrl, templateUrl: 'addEmp.html' }).
            when('/addLoc', { controller: LocCtrl, templateUrl: 'newLocation.html' }).
        otherwise({ redirectTo: '/' });
    });



mainApp.factory("addEmp", ['$resource', function ($resource) {
    return $resource('/api/addEmp/:id', { id: '@id' }, { update: { method: 'PUT' } });
}]);

mainApp.factory("addLoc", ['$resource', function ($resource) {
    return $resource('/api/newLoc/:id', { id: '@id' }, { update: { method: 'PUT' } });
}]);


//Controllers 
var EmpCtrl = function ($scope, $location, addEmp) {

   //code here 
};

var LocCtrl = function ($scope, $location, newLocation) {

   //code here 
};

我要做的是将这一个文件代码组织到不同的文件中。我创建了脚本/控制器文件夹，我想要为控制器提供单独的文件 EmpCtrl.js和LocCtrl.js。当我创建控制器文件并在其中复制控制器代码时，我得到EmptCtrl和LocCtrl的错误未定义。您能否告诉我如何使用适当的路径设置在不同的文件夹中进行设置？谢谢

Answer 1

试试这个

  angular.module("mainApp", ["ngRoute", "ngResource", "ui"]).
    config(function ($routeProvider) {
        $routeProvider.
            when('/addEmp', { controller: 'empCtrl', templateUrl: 'addEmp.html' }).
            when('/addLoc', { controller: 'locCtrl', templateUrl: 'newLocation.html' }).
        otherwise({ redirectTo: '/' });
    });



    //in empCtrl.js file
    angular.module('mainApp').controller('empCtrl', ['$scope', '$location', 'addEmp',
        function ($scope, $location, addEmp) {
        //code here 
    }]);

    // same for locCtrl

在你的html中，确保在empCtrl和locCtrl脚本之前包含你的mainApp.js文件关键是你使用字符串名称在你的溃败配置中引用你的控制器

    { controller: 'empCtrl' ... }

而不是

    { controller: EmpCtrl ... }

我建议您使用require.js模块化您的Angular项目，您不必担心脚本包含的顺序，这将导致更清洁的项目

设置文件路径并在Angularjs中组织代码

1 个答案: