简体   繁体   English

AngularJS无法正常工作并且页面加载太慢

[英]Angularjs not working and page loading too slow

I'm going through a tutorial on w3schools and I copied one of their snippets. 我正在阅读有关w3schools的教程,并复制了其中的片段。 When I try to view the page in my browser it takes like half a minute to load. 当我尝试在浏览器中查看页面时,加载过程大约需要半分钟。 Also, the functions simply aren't working. 而且,这些功能根本不起作用。 This code seems to work only on w3schools. 此代码似乎仅在w3schools上有效。 They've provided cdn's (which are outdated but should still work). 他们提供了CDN(已经过时,但仍然可以使用)。 Any assistance is greatly appreciated. 非常感谢您的协助。

 <!DOCTYPE html> <html> <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script> <body ng-app="myApp"> <p><a href="#/">Main</a></p> <a href="#banana">Banana</a> <a href="#tomato">Tomato</a> <p>Click on the links to change the content.</p> <p>The HTML shown in the ng-view directive are written in the template property of the $routeProvider.when method.</p> <div ng-view></div> <script> var app = angular.module("myApp", ["ngRoute"]); app.config(function($routeProvider) {    $routeProvider    .when("/", {        template : "<h1>Main</h1><p>Click on the links to change this content</p>"    })    .when("/banana", {        template : "<h1>Banana</h1><p>Bananas contain around 75% water.</p>"    })    .when("/tomato", {        template : "<h1>Tomato</h1><p>Tomatoes contain around 95% water.</p>"    }); }); </script> </body> </html> 

Loading time may due to your network connection, as the page needs to download the angular core from google CDN. 加载时间可能是由于您的网络连接所致,因为该页面需要从google CDN下载角芯。 Load it locally may solve it. 本地加载可能会解决。

However, I noticed you have such code: 但是,我注意到您有这样的代码:

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-route.js"></script>

So I'm wondering, how are you visiting your HTML? 所以我想知道,您如何访问HTML? Do you have a localhost server or directly via file:/// protocol? 您有本地主机服务器还是直接通过file:///协议?

If your answer is latter, then it definitely won't work, as the URL for angular-router may be auto-prefixed as via file:/// protocol too, which is 404 I guess. 如果您的答案是后者,那么它肯定将不起作用,因为有角度路由器的URL也可以通过file:///协议自动前缀,我想是404。

The angular route file you have used is not valid. 您使用的角度路径文件无效。 Please use a valid cdn URL 请使用有效的CDN网址

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.0/angular-route.min.js"></script>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM