您的位置：首页 > Web前端 > AngularJS

AngularJS实现存入文本,搜索文本,敏感字符

2017-10-16 19:52 267 查看

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>实现存入,搜索,敏感字符</title>
<style type="text/css">
.text01{
width: 500px;
height:300px;
border: 1px solid red;
background-color: #ece5d5;
}
</style>
<script src="angular.js"></script>
<script type="text/javascript">
var app = angular.module("myApp",[]);
//自定义过滤器,过滤敏感字符
app.filter("myFilter",function () {
return function (text) {
if(text.indexOf("敏感字符")>=0){
alert("有敏感字符");
//有敏感字符需要过滤
return text.replace(/敏感字符/g,"****");
}
//将所有文本返回
return text;
}
})
app.controller("myCtrl",function ($scope) {
$scope.arr = ["今天早上吃早餐花了10元","今天中午吃午饭花了20元"];
$scope.newarr = "";
$scope.addarr = function () {
//非空判断,为空时不添加
if($scope.newarr == null || $scope.newarr == ""){
alert("内容不可为空");
}else{
$scope.arr.unshift($scope.newarr);
}
}
//搜索文本
var flag = true;
$scope.sousuo = function () {
if($scope.newsousuo == null || $scope.newsousuo == ""){
alert("不可为空");
}else{
for(a in $scope.arr){
if($scope.arr[a] == $scope.newsousuo){
alert("已存在");
flag = false;
}
}
if (flag) {
alert("不存在");
}
}

}
});
</script>
</head>
<body ng-app="myApp" ng-controller="myCtrl">
<p>记账本:</p>
<div class="text01">
<p  ng-repeat="i in arr">{{i | myFilter}}</p>
</div>
输入框:<input type="text" ng-model="newarr"><button ng-click="addarr()">记录</button><br>
搜索框:<input type="text" ng-model="newsousuo"><button ng-click="sousuo()">搜索</button>
</body>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航