angularJS1 数据绑定demo

来源：互联网发布：linux安装jdkrpm 编辑：程序博客网时间：2024/05/01 15:37

这里写图片描述

实现功能：
1.在输入框输入内容时，列表中显示添加的内容
2.点击删除时，将删除一个item的内容

<html>    <head>        <meta http-equiv="content-type" content="text/html; charset=UTF-8">        <meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0" />        <script type="text/javascript" src="js/angular.min.js"></script>    </head>    <body ng-app='myapp1' ng-controller="customersCtrl">        <input type="text" ng-model="task" />        <button ng-click="add()">提交</button>        <h3>任务列表</h3>        <ul style="width: 100%;height: auto;">            <li style="width: 100%;height: auto;list-style: none;" ng-repeat="item in tasks track by $index">{{item}}                <a ng-click="tasks.splice($index,1)">删除</a>            </li>        </ul>    </body>    <script type="text/javascript">        var app = angular.module('myapp1', []);        app.controller('customersCtrl', function($scope) {            $scope.task = "";            $scope.tasks = [];            $scope.add = function() {                $scope.tasks.push($scope.task);            }        });    </script></html>

0 0