无法加载模板AngularJS

我试图加载角模板，但得到一个错误：无法加载模板AngularJS

Failed to load resource: net::ERR_FILE_NOT_FOUND angular.js:102 Error: [$compile:tpload] http://errors.angularjs.org/1.3.15/ $compile/tpload?p0=pages%2Fhome.html at Error (native) at file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:6:417 at file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:137:25 at file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:112:113 at n.$eval (file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:126:15) at n.$digest (file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:123:106) at n.$apply (file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:126:293) at l (file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:81:240) at M (file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:85:342) at XMLHttpRequest.e (file:///C:/Users/Abu-Mustaqiima/Documents/AngularJS/WeatherApp/Video1/Starter/angular.js:86:418)

这里是我的index.html

<!DOCTYPE html> 
<html lang="en-us" ng-app="weatherApp"> 
    <head> 
     <title>AngularJS Weather Forecast SPA</title> 
     <meta http-equiv="X-UA-Compatible" content="IE=Edge"> 
     <meta charset="UTF-8"> 

     <!-- load bootstrap and fontawesome via CDN --> 
     <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css"> 
     <style> 
      html, body, input, select, textarea 
      { 
       font-size: 1.05em !important; 
      } 
     </style> 

     <!-- load angular via CDN --> 
     <script src="http://code.angularjs.org/1.3.0-rc.2/angular.min.js"></script> 
     <script src="http://code.angularjs.org/1.3.0-rc.2/angular-route.min.js"></script> 
     <script src="http://code.angularjs.org/1.3.0-rc.2/angular-resource.min.js"></script> 
     <script src="app.js"></script> 
    </head> 
    <body> 

     <header> 
      <nav class="navbar navbar-default"> 
      <div class="container"> 
       <div class="navbar-header"> 
        <a class="navbar-brand" href="/">AngularJS Weather</a> 
       </div> 

       <ul class="nav navbar-nav navbar-right"> 
        <li><a href="#"><i class="fa fa-home"></i> Home</a></li> 
       </ul> 
      </div> 
      </nav> 
     </header> 

     <div class="container"> 

      <div ng-view></div> 

     </div> 

    </body> 
</html> 

// MODULE 
var weatherApp = angular.module('weatherApp', ['ngRoute', 'ngResource']); 

// ROUTES 
weatherApp.config(function ($routeProvider) { 

    $routeProvider 

    .when('/', { 
     templateUrl: 'pages/home.htm', 
     controller: 'homeController' 
    }) 

    .when('/forecast', { 
     templateUrl: 'pages/forecast.htm', 
     controller: 'forecastController' 
    }) 

}); 

// CONTROLLERS 
weatherApp.controller('homeController', ['$scope', function($scope) { 

}]); 

weatherApp.controller('forecastController', ['$scope', function($scope) { 

}]);

我尝试使用WAMP服务器加载网页，但仍然会得到相同的错误。

来源

2015-04-21 Abdi

确保您在身体标记的末尾加载您的JavaScript。你是否在app.js中引用你的模块？ – jcc

我认为它主要是因为你正在从文件中查看index.html。尝试通过服务器为您的项目服务 – Harish

您正在使用哪种浏览器？不是所有的浏览器都友好的文件：//路径 –

当前您的模板协议包含file://，它不能通过您的浏览器进行访问。

您需要在某些服务器上托管您的代码（如IIS，WAMP等）&将您的整个代码目录粘贴到服务器上，以便工作您的代码。其他方面你的代码看起来不错。

因此，URL应该是http://或https://那么您的模板将直接从服务器获取。

来源

2015-04-21 17:43:39

我已经试过这与WAMP和仍然是相同的错误。 – Abdi

@Abdi你能否更新你的问题？ –

我刚刚做了几分钟前。谢谢 – Abdi

无法加载模板AngularJS

回答

相关问题