2016-02-11 21 views
1

我对角度很陌生,试图在角度指令中使用templateUrl。当我试图运行在浏览器中的本地HTML它显示我的这些错误 - >如何摆脱chrome中的跨源请求块?

的XMLHttpRequest无法加载文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/baseChild1.html。协议方案仅支持交叉源请求:http,data,chrome,chrome-extension,https,chrome-extension-resource。

错误:[$编译:tpload] http://errors.angularjs.org/1.5.0-rc.0/ $编译/ tpload P0 = baseChild1.html & P1 = -1 & P2 = 在错误(天然) 在file:///用户/ suparnadey /桌面/工作区/ AngularJS/angular_directives/angular.min.js:6:421 at file:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:149:48 at file:/// Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:123:217 at m。$ eval(file:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js :137:446) at m。$ digest(file:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js :135:41) at m。$ apply(file:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:138:236) at file:/// Users/suparnadey /桌面/ workspace/AngularJS/angular_directives/angular.min.js:20:10 at Object.e [as invoke](file:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js: 40:477) 在C(文件:///Users/suparnadey/Desktop/workspace/AngularJS/angular_directives/angular.min.js:19:440)

base.html文件

<!DOCTYPE html> 
<html ng-app="iAXApp"> 

    <head> 
    <meta charset="utf-8" /> 
    <title>IONOS iAX</title> 

    <!-- <link rel="stylesheet" type="text/css" href="base.css"> --> 

    <script src="angular.min.js"></script> 
    <script src="base.js"></script> 

    </head> 
    <body ng-controller="MainCtrl"> 

     <main-directive></main-directive> 

    </body> 

</html> 

个base.js

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

app.controller('MainCtrl', function($scope) { 
    $scope.name = "Publisher"; 


}); 

app.directive("mainDirective", function(){ 
    return{ 
     restrict: 'E', 
     // tamplate: "<h1>{{name}}</h1>", 
     templateUrl: "baseChild1.html" 
    } 
}); 

baseChild1.html

<h1>{{name}}</h1> 
+0

请问您还可以添加baseChild1.html吗? – Radu

+0

我已经添加了它... – Suparna

回答

1

这是所有现代浏览器阻止跨起源请求标准安全原因。

安装此插件铬和启用它:chrome plugin to enable cors

如果这不起作用,那么你应该尝试运行HTTP的服务器上的项目。 看一看这个答案:http-server to run local projects.

我希望这肯定会有所帮助。

+0

在您的浏览器中安装安全漏洞是一个可怕的想法。 – Quentin

+0

不是当你在本地工作。 –

+0

该插件似乎不能“本地”工作。该文档使它看起来为每个站点设置标题。 – Quentin