Question

我正在尝试编写一个仅限AngularJS客户端的应用程序我想我可以通过在地址栏中输入来从chrome加载它：文件：/// C：/path/to/project//index.html 我还尝试使用标志--allow-file-access-from-files

调用chrome

不幸的是没有发生任何事情 - 只是标签名称上的繁忙标志正常工作为什么不加载我的应用程序？

我正在使用以下代码：

的index.html：

<!doctype html>
<html ng-app="app">
<head>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular.min.js"></script>
    <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-route.js"></script>
    <script src="app.js"></script>
    <title></title>
</head>
<body style="background-color: white;">
<h1>Index</h1>
<a id="link" href="/login">Go to login</a>
<ng-view></ng-view>
</body>
</html>

app.js：

angular.module('app', ['ngRoute']).
   config(function($routeProvider) {
        $routeProvider.
            when('/', {controller: HomeCtrl, templateUrl: 'app.html'}).
            when('/login', {controller: LoginCtrl, templateUrl: 'login.html', resolve: function() {}}).
            otherwise({redirectTo:'/'});
    });

function HomeCtrl($scope) {
    $scope.numbers = [1,2,3,4,5];
}

function LoginCtrl($scope) {

}

app.html：

<div ng-controller="HomeCtrl">
    <ul ng-repeat="number in numbers" >
        <li>{{number}}</li>
    </ul>
</div>

修改

2种可能的解决方案：

关闭所有Chrome实例并从命令行运行：
“C：\ Program Files（x86）\ Google \ Chrome \ Application \ chrome.exe” - allow-file-access-from-files - 允许文件访问
运行没有此限制的Firefox（如提及的@GeekBoy）

Answer 1

据我所知，谷歌浏览器不允许从文件系统运行javascripts。但我做了一个快速的谷歌搜索，发现了这一点。可能有用 Link

另一方面，你可以使用firefox。据我所知，Firefox并没有这样的限制

Answer 2

尝试更改以下行：

<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular.min.js"></script>
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-route.js"></script>

到

<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular.min.js"></script>
<script type="text/javascript" src="http://cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.16/angular-route.js"></script>

我认为既然您使用基于文件的方式来获取index.html，那么假设//也指向本地系统资源。通过专门指出http://，它将查看实际位置。

Answer 3

我知道这是一个老问题，但对于任何可能仍感兴趣的人来说，这是一个小项目，演示如何编写angularjs客户端应用程序。它是一个完整的AngularJS 1.63单页面应用程序，其路由不需要Web服务器：https://github.com/jlinoff/aspa-nows。

让它工作有两个主要挑战：由于新引入的默认哈希前缀href（请参阅aa077e8了解详细信息），因此可以正确获取页面!引用，以及将模板HTML代码嵌入index.html作为ng-template脚本以避免CORS错误。一旦修复完成，它就会按预期工作。

项目README.md详细解释了需要完成的工作，并提供了完整的源代码。

AngularJS编写没有服务器的应用程序

3 个答案: