为什么有时angularjs ng-include不适用于chrome?

时间:2018-03-09 08:09:40

标签: html angularjs google-chrome

<html ng-app="myApp1">
<head>
    <title>NG-Include</title>
    <script src="angular.js"></script>
    <script src="filter.js"></script>

</head>
<body>
    <div ng-controller="myController">
        <div ng-include="'table.html'"></div>
    </div>


</body>
</html>

这是我的角度代码,我曾经使用ng-include在此视图上加载另一个视图。另一个视图在下面

<table>
        <thead>
            <th>name</th>
            <th>dob</th>
            <th>gender</th>
            <th>salary</th>
        </thead>
        <tbody ng-repeat="person in persons">
            <tr>
            <td>{{ person.name | uppercase }}</td>
            <td>{{ person.dob | date:"dd/MM/yyyy" }}</td>
            <td>{{person.gender | lowercase}}</td>
            <td>{{person.salary | currency}}</td>
        </tr>
    </tbody>
</table>

这是table.html 我的js文件是

var myApp = angular.module("myApp1",[]);
myApp.controller("myController", function($scope){
    var table = [
    {name: "dhananjana", dob: new Date("September 6, 1995"), gender:"Male", salary: 1223.445},
    {name: "thilini", dob: new Date("April 18, 1995"), gender:"Female", salary: 134.981},
    {name: "Tharindu", dob: new Date("October 12, 1994"), gender:"Male", salary: 1123.12},
    {name: "Primali", dob: new Date("May 13, 1994"), gender:"Female", salary: 124.44},
    {name: "Pasindu", dob: new Date("June 3, 1995"), gender:"Male", salary: 122.45}
    ];
    $scope.persons = table;
    // $scope.row = 3;
    // $scope.sortCol = "name";

});

当我使用chrome加载此页面时,它将显示此错误消息

Failed to load file:///C:/Users/Dhananjana/Desktop/js/table.html: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

但是当我使用mozilla firefox它可以正常工作时你能解释为什么会在chrome中发生这种情况吗?

1 个答案:

答案 0 :(得分:0)

  

您不是通过服务器(如Apache或nginx)打开页面,因此当浏览器尝试获取资源时,它认为它来自单独的域,这是不允许的。

解决方案

  

通过Apache,nginx,节点等Web服务器打开您的页面。

Source