Angular JS模板現在顯示

我有問題試圖在我的index.html文件中顯示部分html（不顯示任何內容）。Angular JS模板現在顯示

請參閱我的index.html代碼：

<!doctype html> 
<html lang="en" ng-app="myApp"> 
    <head> 
     <meta charset="utf-8"> 
     <title>My AngularJS App</title> 
     <link rel="stylesheet" href="css/app.css"/> 
     <link rel="stylesheet" href="css/animations.css"/> 
     <link rel="stylesheet" href="css/bootstrap.css"/> 
     <script src="js/jquery-1.11.0.min.js"></script> 
     <script src="lib/angular/angular.js"></script> 
     <script src="lib/angular/angular-animate.js"></script> 
     <script src="lib/angular/angular-route.js"></script> 
     <script src="lib/angular/angular-resource.js"></script> 
     <script src="js/app.js"></script> 
     <script src="js/animations.js"></script> 
     <script src="js/services.js"></script> 
     <script src="js/controllers.js"></script> 
     <script src="js/filters.js"></script> 
     <script src="js/directives.js"></script> 
    </head> 
    <body> 
     <li> 
      <a href="#people">Show People</a> 
     </li> 
     <div ng-view></div> 
    </body> 
</html>

然後我嘗試加載people.html是在諧音目錄中，使用上app.js路由：

'use strict'; 

// Declare app level module which depends on filters, and services 
var myApp = angular.module('myApp', ['ngRoute', 'filters', 'services', 'directives', 'controllers']); 

myApp.config(['$routeProvider', 
function($routeProvider) { 
    $routeProvider.when('/people', { 
     templateUrl : 'patials/people.html', 
     controller : 'PeopleController' 
    }).otherwise({ 
     redirectTo : '/people' 
    }); 
}]);

如果我更換我的index.html中的ng-view部分和我的模板文件內容一切正常，所以我不認爲我的控制器聲明有問題。

你能看看並幫我弄清楚有什麼問題嗎？

謝謝！

來源

2014-03-01 Santiago Hernandez

你確定它不是一個這裏錯字 - 路徑說'輕拍ials/people.html'（不partials）..你可以張貼一個jsfiddle，如果它仍然是一個問題 – rajasaur

我修復了這條線，但它仍然是機器人加載。 –

Plnkr.co可能會在這裏更好地工作，因爲這個問題與路由和多個文件有關。還要檢查你的控制檯和網絡選項卡和腳本選項卡在鉻調試器（或任何調試器），看看是否有任何錯誤在控制檯中，B任何失敗的請求在網絡選項卡和C它的加載你的腳本和點擊斷點碼。 – shaunhusain

您在控制器內部使用var myApp = angular.module('myApp', []);。如果在angular.module中添加一個數組作爲第二個參數，則該模塊將自動創建爲新模塊，並覆蓋前一個具有相同名稱的模塊，因此config不再有效，因爲在您的代碼中，它是在不同的模塊上定義的。

只是在PeopleController定義從

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

修改代碼，

var myApp = angular.module('myApp');

，它應該工作

編輯普拉克： http://plnkr.co/edit/bK9vHSPxKmijhlLPS5C5?p=preview

來源

2014-03-01 22:32:19 doodeec

解決了我的問題，但我還需要更改app.js上的另一行：var myApp = angular.module （'myApp'，['ngRoute'，'filters'，'services'，'directives'，'controllers']）; for this = var myApp = angular.module（'myApp'，['ngRoute']）; –

謝謝！我仍然不明白app.js –

上的那條線有什麼問題，它也被糾正了，但我認爲這是故意的。原因是數組中的那些字符串是'myApp'依賴的模塊的名稱...顯然這些模塊不存在於您的應用程序中，因此它會拋出實例化錯誤。 – doodeec

Angular JS模板現在顯示

回答

相關問題