回车键触发input渲染到ul的li中

来源:互联网 发布:贸易结构优化 编辑:程序博客网 时间:2024/05/08 01:46
<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>        <script>            var app = angular.module("gaoynApp", []);            app.controller("democ", ["$scope", function($scope) {                $scope.listdata = []; //列表数据                //创建save函数,向数组中添加数据                $scope.save = function() {                    //1 获取输入框的值                    console.log("获得输入框的值:", $scope.newdata); //$scope.newdata                    /**                     * 判断值是否在数组中存在                     */                    var i = $scope.listdata.toString().indexOf($scope.newdata); //1 把数组转为字符串  2利用字符串indexOf查找是否存在                    if(i<0){                    //2 把值添加数组中--->把值添加到数组最前面                    $scope.listdata.unshift($scope.newdata);                    //3 添加完毕以后,把输入框的值清空                    $scope.newdata = "";                    }else{                        alert("已经存在!!!");                    }                }            }]);        </script>    </head>    <body ng-app="gaoynApp" ng-controller="democ">        <form ng-submit="save()">            <input ng-model="newdata" />        </form>        <ul>            <li ng-repeat="d in listdata">{{d}}</li>        </ul>    </body></html>
原创粉丝点击