angularjs添加和搜索

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/xieshuaikang/article/details/78513871

<!DOCTYPE html>
<html ng-app="xieapp">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style type="text/css">
            div{
                width: 400px;
                height: 200px;
                margin: 0  auto;
                border: 1px goldenrod solid;
            }
            span{
                margin-left:43%;
            }
            .but{
            margin-left: 50%;
            }
        </style>
        <script src="angular-1.5.5/angular.js"></script>
    <script>
        var app=angular.module("xieapp",[]);
        app.controller("dose",["$scope","$filter",function($scope,$filter){
        $scope.data = [];
        //点击记录事件
            $scope.jilu=function(){
                for (var i=0;i<$scope.data.length;i++) {
                    if($scope.data[i]==$scope.aa){
                        alert("已存在");
                        $scope.jilu.stopPropagation();
                    }
                }
                if($scope.aa!="他妈"){
                    $scope.data.push($scope.aa);                
            //$scope.kk=$scope.data.toString();
                }else{
                    //关键字替换
                    var aa = $scope.aa;
                    $scope.data.push(aa.replace(aa,"**"));
                }
                //排序
                //$scope.data= $filter('orderBy')($scope.data,false);
                //倒叙
                $scope.data.reverse();

            }
            //搜索按钮
            $scope.suo=function(){
                for (var i=0;i<$scope.data.length;i++) {
                    if($scope.bb==$scope.data[i]){
                        alert("搜到啦");
                        $scope.suo.stopPropagation();
                    }else if(i==$scope.data.length-1){
                        alert("没有找到");
                        $scope.suo.stopPropagation();
                    }
                }
            }
        }]);
    </script>
    </head>
    <body ng-controller="dose">
        <span>记事本</span>
            <div>
                <p ng-repeat="d in data">
                    {{d}}
                </p>
            </div>
        <br />
        <span>输入框</span><input type="text" ng-model="aa"/>
        <br />
        <br />
        <input class="but" type="button" value="记录" ng-click="jilu()"/>
        <br />
        <br />
        <span>搜索框</span><input type="text" ng-model="bb" />
        <input class="but" type="button" value="搜索" ng-click="suo()"/>
    </body>
</html>
 

猜你喜欢

转载自blog.csdn.net/xieshuaikang/article/details/78513871