AngularJS-简单的教程不起作用

AngularJS - simple tutorial wont work

本文关键字:不起作用 的教程 简单 AngularJS-      更新时间:2023-09-26

我从Angular开始,遇到了应该可以工作的代码,但它没有。

Angular是通过脚本标记下载和添加的,它是正确的,其他教程以前也做过。

我什么都试过了,但似乎没有发现问题出在哪里。开始学习奥的AngularJS一书。

<html ng-app="nameApp">
<head>
<title>Angular Training</title>
</head>
<body ng-controller="NameCtrl">
<ul>
    <li ng-repeat="name in names"> {{ name }}
        <a href="" ng-click="removeName(name)">remove</a>
    </li>
</ul>
<form ng-submit="addName()">
    <input type="text" ng-model="enteredName">
    <input type="submit" value="add">
</form>
<script src='unzipped___AngularJS-1.3.12'angular-1.3.12'angular.min.js'></script>
<script>
    var nameApp = angular.module('nameApp', []);
    nameApp.controller('NameCtrl', function ($scope){

                $scope.names = ['Larry','Curly', 'Moe'];
                $scope.addName = function(){
                    $scope.names.push($scope.enteredName);
                    $scope.enteredName = '';
                };
                $scope.removeName = function(name){
                    var i = $scope.names.indexOf(name);
                    $scope.names.splice(i, 1);
                };
    });     
</script>

</body>
</html>

https://jsfiddle.net/eqk5adc1/3/

https://jsfiddle.net/5qv2e2jm/尝试添加此

<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>

根据评论,您可能会遇到安全问题。出于安全原因,现代浏览器通常可以阻止从本地文件系统加载外部js文件。这取决于您使用的浏览器。有关详细信息,此安全概念称为同源策略。

"这是一个Javascript框架,所以在我看来,服务器可以省略…"

由于上述安全概念,这不一定是真的。如果您正在使用Firefox,您可以使用以下步骤禁用此安全功能(尽管我只建议暂时禁用):

  1. 导航到about:config
  2. 在搜索栏中键入security.fileuri.strict_origin_policy
  3. 将此属性设置为false

这些步骤应该允许在Firefox中加载本地js文件。最后,简单地设置服务器或使用廉价的云服务器(谷歌、亚马逊、c9.io等)可能会更容易。另一种选择可能只是像上面那样使用jsfiddle。