Javascript ng包括不加载指定文件的内容_Javascript_Html_Angularjs_Angularjs Ng Include

Javascript ng包括不加载指定文件的内容

javascript html angularjs

Javascript ng包括不加载指定文件的内容,javascript,html,angularjs,angularjs-ng-include,Javascript,Html,Angularjs,Angularjs Ng Include,我目前是一名初学者，正在学习angularJS。使用ng include 我有2个html源文件。两个文件位于同一目录中 index.html header.html index.html： <!DOCTYPE html> <html lang="en" ng-app="myNinjaApp"> <head> <title>NG!</title> <link href="content

我目前是一名初学者，正在学习angularJS。使用

ng include

我有2个html源文件。两个文件位于同一目录中

index.html
header.html

index.html：

<!DOCTYPE html>
<html lang="en" ng-app="myNinjaApp">
    <head>
        <title>NG!</title>
        <link href="content/css/styles.css" rel="stylesheet" type="text/css" />
        <script src="app/lib/angular.js"></script>
        <script src="app/app.js"></script>
    </head>

    <body> 
        <ng-include src="'header.html'"></ng-include>
        <div ng-controller="NinjaController">
            <p>{{message}}</p>
            <input type="text" ng-model="search" />
            <input type="text" ng-model="rateFilter" />
            <ul>
                <li ng-repeat="ninja in ninjas | orderBy: '-name' | filter: search">{{ninja.name}} - {{ninja.rate | currency}}</li>
            </ul>
        </div>
    </body>
<html>


NG！
{{message}}

{{ninja.name}-{ninja.rate | currency}”

header.html

<div>
    <h1>Ninja Directory</h1>
    <ul>
        <li><a href="">Home</a></li>
        <li><a href="">List Ninjas</a></li>
    </ul>
</div>


忍者名录

在浏览器中查看index.html时，我的header.html页面的内容丢失。我在这里遗漏了什么？

我认为问题的根本原因是从文件系统运行index.html。如果您查看控制台，将看到一个错误：

js:13562在'file:///header.htmlCORS策略已阻止“来自源”的“null”：跨源请求仅支持协议方案：http、数据、chrome、chrome扩展、https

要解决此问题，请尝试在某些本地服务器（apache、nginx、node.js等）上运行您的页面。

检查开发人员控制台中的网络面板以查看该文件的XHR。谢谢。这不仅是正确的答案，而且在研究如何按照上面的说明使用控制台时，我了解了使用chrome作为web开发工具的价值。