Question

当我尝试在AngularJS中进行编码时，

使用templateUrl时未加载HTML文件

我的HTML代码

 index.htm

    <!DOCTYPE html>
    <html>
    <head>
        <title>Home</title>
        <link rel="stylesheet" type="text/css" href="css/index.min.css">
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
    </head>
    <body ng-app="myApp">
        <div class="nav-bar">
            <ul class="nav-inner">
                <li class="active"><a href="">Home</a></li>
                <li><a href="#/about">About</a></li>
                <li><a href="#/gallery">Gallery</a></li>
                <li><a href="#/contact">Contact</a></li>
            </ul>
        </div>
        <br><br><br><br><br><br>
        <div ng-view></div>
    </body>
    </html>

我的JavaScript代码是

var app = angular.module("myApp", ["ngRoute"]);
app.config(function($routeProvider) {
    $routeProvider.when("/about", {
        templateUrl: "about.htm"
    });
});

about.htm页面位于index.htm所在的文件夹中。

我想我被困住了，请帮忙。

更新：

在以下位置访问XMLHttpRequest '文件：/// C：/Users/Raymond%20Thomas/Desktop/JavaScript%20Tutorial/about.htm' 来自原点“ null”的信息已被CORS政策阻止：交叉原点仅协议方案支持请求：http，data，chrome， chrome-extension，https。

这是在控制台中记录的错误

Answer 1

工作正常，问题是我试图在没有服务器的情况下运行页面。当我在localhost中运行它时，它工作正常。

在Angular JS路由中未加载htm文件

1 个答案: