为什么我的控制器未在以下代码中注册？

我的索引文件：为什么我的控制器未在以下代码中注册？

<!DOCTYPE html> 
<html ng-app="myApp" ng-controller="homingController"> 
<head> 
<title></title> 
<script src="./js/jquery-1.9.1.js"></script> 
<script src="./js/jquery-ui.js"></script> 
<script src="./js/angular.js"></script> 
<script src="./js/angular-ui-router.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-route.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.3/angular-ui-router.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/1.0.3/angular-ui-router.min.js"></script> 
<script src="./Controller/homingController.js"></script> 
<link rel = "stylesheet" href = "./css/angular-material.min.css"> 
<link rel="stylesheet" href="./css/bootstrap-theme.min.css"> 
<link rel = "stylesheet" href = "./css/materialize.min.css"> 
<link href="./css/icon.css" rel="stylesheet"> 
<link rel ="stylesheet" href="./css/Main.css"> 
<title>Home Application</title> 
</head> 

<body> 
<div class="navbar"> 
<a href="#/home">Home</a> 
<a href="#/monitor">about</a> 
</div> 
<div ng-view></div> 

<script> 
var mainApp = angular.module('myApp', ['ngRoute']); 

mainApp.config(function($routeProvider) { 

    $routeProvider.when('/home', { 
     template: "home", 
     controller: 'homingController' 
    }) 
     .when('/monitor', { 
      template: "<p>{{firstName}}{{lastName}}</p>", 
      controller: 'monitoringController' 
     }) 
     . 
     otherwise({ 
      redirectTo: '/' 
     }); 
}); 

    mainApp.controller('monitoringController', ['$scope', function($scope) { 
    $scope.firstName = "John"; 
    $scope.lastName = "Doe"; 
}])

我HomingController.js

var mainApp = angular.module('myApp', ['ngRoute']); 
mainApp.controller('homingController', ['$scope', function($scope) { 
$scope.firstName = "John"; 
$scope.lastName = "Doe"; 
}])

我的Home.html代码：

<div ng-controller="homingController"> 
{{ lastName }} Hello 
</div>

现在我面临的问题：

1）在homingController，如果我添加了第一行是：

var mainApp = angular.module('myApp', ['ngRoute']);

那么它给我的错误：

angular.js：14328错误：[$控制器：ctrlreg]名称为“homingController”的控制器未注册。

1）在homingController，如果我不添加添加第一行是：

var mainApp = angular.module('myApp', ['ngRoute']);

那么它给我的错误：

angular.js：14328错误：[$控制器：ctrlreg该名为'homingController'的控制器未注册。

谢谢!!

来源

2017-10-18 CodeWithCoffee

你确定'homingController.js'被正确包含吗？确保它已加载。 – Red

你能为这个代码做一个蹲点吗？ – VicJordan

是它增加了，我可以看到它的源码 – CodeWithCoffee

您在声明模块两次，你controller.js文件

//删除此行

var app = angular.module("myApp", []);

///

app.controller("homingController", function($scope) { 
$scope.firstName = "John"; 
$scope.lastName = "Doe"; 
});

DEMO

来源

2017-10-18 07:37:12 Sajeetharan

这是给控制台上的错误，未捕获的ReferenceError：应用程序未定义 – CodeWithCoffee

@CodeWithCoffee检查演示 – Sajeetharan

谢谢!!是否有可能在codepen？我没有访问plunkr，或者你可以粘贴在这里？ – CodeWithCoffee

我认为问题在于您将控制器添加到模块的方式。

尝试homingController

var app = angular.module("myApp", []);

更改以下行

var app = angular.module("myApp");

来源

2017-10-18 07:42:48 Yuvraj

Sajeetharan是正确的。你声明的模块但是两次删除它在你的controller.js使得的Uncaught ReferenceError: app is not defined错误，因为你还没有宣布该模块创建控制器

我的建议是让你的主页之前到

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

    // Define routes 
    $routeProvider.when('/home', { 
     templateUrl: 'home.html', 
     controller: 'homingController' 
    }).when('/monitor', { 
     templateUrl: 'home.html', 
     controller: 'monitoringController' 
    }).otherwise({ 
     redirectTo: 'home' 
    }); 

} 
]);

因为该应用程序首先在控制器中定义。js

来源

2017-10-18 08:39:36 Riyenz

为什么我的控制器未在以下代码中注册？

回答

相关问题