AngularJS 不工作答案

【问题标题】：AngularJS isn`t workingAngularJS 不工作
【发布时间】：2015-02-14 09:42:07
【问题描述】：

看完这个演示文稿 (https://www.youtube.com/watch?v=ImR0zo1tA_I) 我想试试 Angular JS。我复制了代码，正是屏幕上的内容，但我不工作。我在浏览器中尝试过，在我的页面 (http://thecodemaker.com.pl) 中，我正在研究 AngularJS，但它仍然不想工作。代码：

<!DOCTYPE html>
<html ng-app="basicApp">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="css/bootstrap.css">
        <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.11/angular.min.js"></script>
	
    </head>
    
<body ng-controller="TodoController">
    <form>
        <div class="container">
            <div class="panel panel-primary">
                <div class="panel-heading">
                   <h1 class="panel-title"><b>ToDo List</b></h1> 
                </div>
                <ul class="list-group">
                    <li class="list-group-item" ng-repeat = "todo in todos">
                        <div class="checkbox">
                            <label>
                                <input type="checkbox"> {{todo}}
                            </label>
                                <button type="button" class="close">&times;</button>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="form-group has-feedback">
                <label class="control-label invisible">Enter Task</label>
                <input type="text" class="form-control text-primary"></input>
                <button type="button" class="close form-control-feedback text-muted">&plusmn;</button>
            </div>
        
            <div class="alert alert-info">Enter new task to get started</div>
            <div class="alert alert-danger">Maximum number of tasks allowed : 5</div>
        
        </div>
    </form>
    
    <script src="js/bootstrap.min.js"></script>
	<script src="js/jquery-1.11.2.js"></script>
    <script>
    angular.module("basicApp", [])
    .controller("TodoController", ["$scope", function($scope) {
        $scope.todos =['Buil an atomic bomb','Sell it on ebay']
    }
</script>
    
</body>
</html>

有什么想法吗？

【问题讨论】：

标签： javascript angularjs html

【解决方案1】：

您的 sn-p 似乎有很多问题。一方面，您的提交/添加按钮没有绑定到事件侦听器或任何东西，因此它没有做任何您想做的事情（例如向控制器的 $scope 上的属性添加项目）。

查看 Angular 官方网站上的 Todo 示例，它是最新的。

https://angularjs.org/（向下滚动）。

这是它的视频：https://www.youtube.com/watch?v=WuiHuZq_cg4

【讨论】：

我知道现在我的按钮什么也没做。现在我希望能够使用 ng-repeat 来显示任务。
哦，对了，你的问题应该这么说！老实说，我认为解决这个问题的最简单方法是先使用不同的教程来学习 AngularJS 的基础知识，然后再尝试使用 Bootstrap。您当前的副本和粘贴的 sn-p 有很多问题，所以这不是回答一个问题的问题，还有更多问题。我链接到的页面应该会提供更多帮助。
谢谢，我一定会看这个视频的。

【解决方案2】：

有一个错误：Bootstrap's JavaScript requires jQuery，这意味着你需要将jQuery库添加到你的项目中，bootstrap.js需要

【讨论】：

【解决方案3】：

从 Angular 1.3.x 开始，您不能再将控制器声明为 window 上的通用全局函数。控制器现在必须使用更新的组件声明形式。

<script>
    angular.module("basicApp", [])
    .controller("TodoController", ["$scope", function($scope) {
        $scope.todos =['Buil an atomic bomb','Sell it on ebay']
    }
</script>

在 HTML 中，将 ng-app="" 更改为 ng-app="basicApp。

【讨论】：