为什么 AngularJS ng-view 在本地不起作用? [英] Why does AngularJS ng-view not work locally?

问题描述

我已经花了几个小时来让我的链接通过我的 AngularJS 应用程序点击进入不同的视图.

但是，我似乎只能在 Plunker 上获得在线工作的功能.

我一直在尝试在我的机器上本地测试点击功能，但 ng-view 似乎没有加载.当我下载我知道正确的 Plunker 代码时，因为它正在 Plunker 上运行，ng-view 似乎在本地托管后停止工作.

我在 ng-include 和我定义为它们自己的 HTML 标签的指令方面也遇到了类似的问题.

是否有原因这些在我的计算机上无法本地运行?(以及我可以修复它以用于测试目的的方法吗?)

您可以在 此处查看我在 Plunker 上谈论的一些代码，如果你愿意.

解决方案

ng-view 和 ng-include 都使用 AJAX 来加载模板.问题是浏览器默认不允许 AJAX 请求位于本地文件系统上的文件(出于安全原因).因此，您有两个选择:

1. 运行将为您的文件提供服务的本地网络服务器
2. 告诉您的浏览器允许访问本地文件

如果您使用的是 Mac，那么第一个选项相当容易，因为您有几个内置的 Web 服务器(Apache httpd 和名为 SimpleHTTPServer 的 Python 模块).要运行 Python SimpleHTTPServer 模块，只需在文件所在的文件夹中打开控制台并运行

python -m SimpleHTTPServer 3000

然后打开浏览器并输入 http://localhost:3000.就是这样.

如果您使用的是 Windows，那也是可能的.例如，您可以安装 Wamp 并从中提供文件.

Chrome 可以使用第二个选项，只需从命令行使用 --allow-file-access-from-files 选项运行它，或将此标志添加到 Chrome 可执行文件路径后的快捷方式.

这个资源也可能有用了解如何在不同的浏览器和使用不同的网络服务器本地运行东西.

I have been working for a few hours on getting my links to click through to different views with my AngularJS app.

However, I can only seem to get the functionality to work online on Plunker.

I've been trying to test the click-through functionality on my machine locally and ng-view does not seem to load. When I download my Plunker code that I know is correct because it is working on Plunker, ng-view seems to quit working once it's hosted locally.

I've also had similar issues with ng-include and directives I've defined as their own HTML tags.

Is there a reason these don't work locally on my computer? (And a way I can fix it for testing purposes?)

You can view some of the code I'm talking about on Plunker here, if you'd like.

解决方案

Both ng-view and ng-include use AJAX to load templates. The problem is that browser by default does not allow AJAX requests to files located on your local file system (for security reasons). Therefore you have two options:

1. Run local web server that will serve your files
2. Tell your browser to allow local files access

If you are on Mac, the fist option is rather easy since you have several built-in web servers (Apache httpd and Python module called SimpleHTTPServer). To run Python SimpleHTTPServer module just open console in the folder your files located at and run

python -m SimpleHTTPServer 3000

then open your browser and type http://localhost:3000. That's it.

If you are on Windows, it's also possible. You can install for example Wamp and serve files from it.

Second option is possible with Chrome, just run it with --allow-file-access-from-files option from command line or add this flag to shortcut after path to Chrome executable.

This resource may also be useful to understand how to run things locally in different browsers and using different web servers.

这篇关于为什么 AngularJS ng-view 在本地不起作用?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！