[英]AngularJS ng-include: Access Denied
我正在使用AngularJS v.1.4.8。
我正在做一个angularJS教程,并且在div上遇到ng-include的问题。 当我将其包含在index.html文件中时,我尝试包含的部分内部代码正常工作,但是由于某些原因,当我尝试将其包含在内时,该程序崩溃了-在控制台中给我一个Error: Access Denied
消息。
该程序使用GitHub API来检索用户并在浏览器中显示其存储库。 API连接没有问题,我还没有达到速率限制。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>AngularJS Tutorial</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="app.js"></script>
<script src="main.ctrl.js"></script>
</head>
<body ng-app="app">
<div ng-controller="MainController">
<h1>{{message}}</h1>
<h4>{{error}}</h4>
<form name="searchUser" ng-submit="search()">
<input type="search" placeholder="username to find" ng-model="username" />
<input type="submit" value="Search" />
</form>
<div ng-include="'userdetails.html'"></div>
</div>
</body>
</html>
<div>
<div>Name: {{user.name}}</div>
<div>Location: {{user.location}}</div>
<img ng-src="http://www.gravatar.com/avatar/{{user.gravatar_id}}" title="{{user.name}}" />
Order:
<select ng-model="repoSortOrder">
<option value="+name">Name</option>
<option value="-stargazers_count">Stars</option>
<option value="+language">Language</option>
</select>
</div>
<table>
<thead>
<tr>
<th>Name</th>
<th>Stars</th>
<th>Language</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="repo in repos | orderBy:repoSortOrder">
<td>{{repo.name}}</td>
<td>{{repo.stargazers_count | number}}</td>
<td>{{repo.language}}</td>
</tr>
</tbody>
</table>
angular.module("app").controller("MainController", function($scope, $http){
$scope.message = "Github Viewer";
var onUserComplete = function(response){
$scope.user = response.data;
$http.get($scope.user.repos_url)
.then(onRepos, onError);
};
var onRepos = function(response){
$scope.repos = response.data;
};
var onError = function(error){
$scope.error = error.status + ": " + error.statusText + " - " + error.data.message;
};
$scope.username = "angular";
$scope.search = function(){
$http.get("https://api.github.com/users/"+$scope.username)
.then(onUserComplete, onError);
};
$scope.repoSortOrder = "-stargazers_count";
});
尝试使用带有ng-bind-html
属性的angular-sanitize.js
。
包含angular-sanitize.js http://ajax.googleapis.com/ajax/libs/angularjs/XXX/angular-sanitize.js
将ngSanitize添加到您的模块依赖项中var myApp = angular.module('myApp', ['ngSanitize']);
<div ng-bind-html="userdetails.html"></div>
我下载了WampServer,现在可以正常工作了……显然无法在本地访问文件,但是由于某种原因,它可以通过服务器工作。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.