$http.get 在 Angular 中给出我的 index.html 的 html [英] $http.get giving the html of my index.html in Angular
问题描述
这是一个奇怪的问题 - 对所有代码提前表示抱歉，但我认为它会帮助您理解我正在尝试的内容.我的 index.html 中有以下内容
This is an odd problem- Sorry in advance for all of the code but I think it will help you understand what I'm attempting. I have the following in my index.html
<!DOCTYPE html>
<html ng-app="mainApp"><!--Bootstrap the angular application -->
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"> </script><!-- Angular js CDN -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular- route.min.js"></script><!-- This adds support for ngRoute -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.3.15/angular-sanitize.min.js"></script><!--This adds support for ngSanitize and bind html-->
<script src="mainapp.js"></script><!-- Main angular application file -->
<script src="scripts/page.js"></script><!--For the Page prototype-->
<link rel="stylesheet" type="text/css" href="mainstyle.css">
<base href="/mainpg/pgBugle/">
<title>[future title]</title>
</head>
<body>
<div ng-view></div><!--This is where our router will place the different fiews-->
</body>
</html>
然后我在 mainapp.js 中有这个
Then I have this in my mainapp.js
(function(){
angular.module('mainApp', ['ngRoute', 'ngSanitize'])
//config sets up application routing
.config(function($routeProvider, $locationProvider){
$routeProvider
.when('/', {
templateUrl: '/mainpg/pgBugle/templates/home.html',
controller: 'homeCtrl',
controllerAs: 'home'
})
.otherwise({
redirectTo: '/'
});
$locationProvider.html5Mode(true); //this allows urls to not have a # at the beginning
})
//These are some basic controllers I set to test functionality
.controller('homeCtrl', function(){
this.name = "<h3>James Allen</h3>";
})
})();
这在我的 page.js-
This in my page.js-
(function(){
angular.module('mainApp')
.config(function($routeProvider, $locationProvider){
$routeProvider
.when('/fat', {
templateUrl: '/mainpg/pgBugle/templates/page.html',
controller: 'pagesCtrl',
controllerAs: 'pages'
})})
.controller('pagesCtrl',['$http', function($http){
var st = this;
$http.get('mainpg/pgBugle/api/page.json').success(function(data) {
st.datas = data;
}
)}]
);}
)();
这在我的 page.html-
This in my page.html-
{{pages.datas}}
<div ng-repeat="page in pages.datas track by $index">
<h3>{{page.pageTitle}}</h3>
<span>{{page.pageAuthor}}</span>
<div>{{page.pageBody}}</div>
</div>
这在我的 page.json 中
[
{
"pageId": 1,
"pageTitle": "A stitch in time",
"pageBody": "<p>This is some</p><p>Content</p>",
"pageAuthor": "James"
},
{
"pageId": 2,
"pageTitle": "Another Time",
"pageBody": "<p>This is a</p><p>lot of information</p>",
"pageAuthor": "Mike"
},
{
"pageId": 3,
"pageTitle": "I like Cheese",
"pageBody": "<p>Cheese is Really</p><p>Good/p>",
"pageAuthor": "Mr. Cheese"
}
]
所有文件都在我编写的路径中，例如 page.json 位于 mainpg/pgBugle 目录中名为 api 的文件夹中.当我运行这个应用程序时，我没有将 page.json 的内容加载到我在 page.js 中有 $http.get 的变量中.我得到了主页的 html 文件的内容，它显示在我有 {{pages.datas}} 的地方.(我把 pages.datas 放在那里试图弄清楚发生了什么，因为我一开始只是在一个空白屏幕上没有错误.)关于为什么 $http 会抓取 index.html 的内容的任何想法，而不是比我的 page.json 文件?
All of the files are in the paths that I have written, for instance the page.json is in a folder called api in the mainpg/pgBugle directories. When I run this application I don't get the contents of the page.json loaded into my variable where I have the $http.get in page.js. I get the contents of the main page's html file and it is displayed where I have {{pages.datas}}. (I put pages.datas in there to try to figure out what was going on since I was just getting a blank screen at first with no errors.) Any ideas as to why $http would be grabbing the content of the index.html rather than my page.json file?
推荐答案
当你请求一个找不到的 URL 时，有时会返回默认的 404 内容，在这种情况下就是 index.html 页面.这因网络服务器而异.
When you request a URL which cannot be found, sometimes the default 404 contents will be returned, which is the index.html page in this case. This differs per webserver.
首先，确保可以检索到'mainpg/pgBugle/api/page.json'，即.通过浏览器的地址栏转到该 URL.
First, make sure that 'mainpg/pgBugle/api/page.json' can be retrieved, ie. by going to that URL via the address bar of the browser.
这篇关于$http.get 在 Angular 中给出我的 index.html 的 html的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
