使用 ng-route 时出现控制器注册错误

debugcn 发表于 Dev

维卡什

我正在使用 v1.6.4 创建一个 angular 应用程序。我正在使用 ngRoute 并且现在已经定义了一个单独的路由条件。我为 angular 模块初始化创建了一个 app.js 文件，并为其他应用程序 js 文件创建了一个单独的文件夹。

应用程序.js：

"use strict";

var appOtmReport = angular.module("appReport", ['ngRoute']);

appOtmReport.config(['$routeProvider',function($routeProvider) {

    $routeProvider.when('/home',{
        templateUrl: 'views/reportSample.html',
        controller: 'js/reportSampleController'
    })
    .otherwise({redirectTo:'/home'});
}]);

索引.html：

<!DOCTYPE html>
<html lang="en"  id="ng-app">
<head>
<meta charset="ISO-8859-1">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">

<title>OTM-DCPP Query Report</title>

<link rel="stylesheet" href="css/bootstrap.min.css">
<link rel="stylesheet" href="css/bootstrap-theme.min.css">

</head>
<body>

<div  ng-app="appReport">
    <ng-view></ng-view>
</div>

<!-- JQuery stuff -->
<script src="lib/jquery.min.js"></script>
<script src="lib/highcharts.js"></script>

<!-- AngularJS framework stuff -->

<script src="lib/bootstrap.min.js"></script>
<script src="lib/angular.min.js"></script>
<script src="lib/angular-route.min.js"></script>

<!-- application specific js -->
<script src="app.js"></script>
<script src="js/reportSampleController.js"></script>


</body>
</html>

控制器（不同目录中的单独文件）：

appOtmReport.controller('reportSampleController',function ($scope){
    $scope.name = "Vikash";
});

当我运行这个时，我得到以下错误：[$controller:ctrlreg] http://errors.angularjs.org/1.6.4/ $controller/ctrlreg?p0=js%2FreportSampleController(...)

结果，我没有得到解析的表达式，但类似于：Hi Name is :{{name}}

我已经浏览了与此类似的其他链接，但没有一个对我有帮助。我将不胜感激任何帮助。

维卡什

我在这里发现了这个问题。我的 app.js 和控制器文件位于不同的文件夹中，因此无法在控制器内部访问该模块。一旦我将 app.js 文件移动到与控制器相同的目录，它就起作用了。

改变了我的 index.html ：

<!-- application specific js -->
<script src="**js/app.js**"></script>
<script src="js/reportSampleController.js"></script>

改变了 app.js：

“严格使用”；

var appOtmReport = angular.module("appOtmDcppQueryReport", ['ngRoute']);

appOtmReport.config(['$routeProvider',function($routeProvider) {

    $routeProvider.when('/home',{
        templateUrl: 'views/reportSample.html',
        **controller: 'reportSampleController'**
    })
    .otherwise({redirectTo:'/home'});
}]);

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。