第一个AngularJS Web应用 todoList

    xiaoxiao2024-03-23  115

    <!DOCTYPE html> <html ng-app="todoList"> <head> <meta charset="UTF-8"> <link rel="stylesheet" href="http://apps.bdimg.com/libs/bootstrap/3.3.0/css/bootstrap.min.css"> <title>todoList</title> </head> <body style="padding:10px;" ng-controller="TaskCtrl"> <div class="input-group"> <input type="text" class="form-control" ng-model="task"> <span class="input-group-btn"> <button class="btn btn-default" ng-click="add()">提交</button> </span> </div> <h4 ng-if="tasks.length>0">任务列表</h4> <ul class="list-group"> <li class="list-group-item" ng-repeat="item in tasks track by $index">{{item}} <a ng-click="tasks.splice($index,1)">删除</a> </li> </ul> </body> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script> <script type="text/javascript"> angular.module('todoList',[]) .controller('TaskCtrl',function($scope){ $scope.task=""; $scope.tasks=[]; $scope.add=function(){ $scope.tasks.push($scope.task); } }) </script> </html>

    相关资源:Angular 实现一个完整的toDoList(待办事项) 以及类似京东App搜索缓存数据功能
    最新回复(0)