爲什麼我的控制器未在以下代碼中註冊？

我的索引文件：爲什麼我的控制器未在以下代碼中註冊？

<!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

爲什麼我的控制器未在以下代碼中註冊？

回答

相關問題