anglur 的非空

最新推荐文章于 2024-05-02 16:26:38 发布
最新推荐文章于 2024-05-02 16:26:38 发布
阅读量351 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/air_show/article/details/79079034
版权
        <script>
                var app=angular.module("myApp",[]);
            app.controller("myCtrl",function($scope){
                $scope.products=[{
                    id:1,
                    name:"nanjing",
                    pass:147258,
                    age:21,
                    sex:"女"
                },{
                    id:2,
                    name:"xiaoxin",
                    pass:148155,
                    age:18,
                    sex:"女"
                },{
                    id:3,
                    name:"hah",
                    pass:25555,
                    age:20,
                    sex:"男"
                }];
                //姓名查找
              $scope.search="";
              //批量删除
              $scope.delete=function(){
                  if(confirm("您确定删除吗")){
                      for (var i=0;i<$scope.products.length;i++) {
                          if($scope.products[i].state==true){
                              $scope.products.splice(i,1);
                              i--;
                          }
                      }
                  }
              }
                //添加
                $scope.tj=function(){
                    var newname=$scope.add_name;
                    var newpass=$scope.add_pass;
                    var newage=$scope.add_age;
                    var newsex=$scope.add_sex;
                    $scope.arr=[];
                    if(newname=="" || newname==undefined){
                        $scope.arr.push("用户名不能为空");
                        $scope.nn=("用户名不能为空");
                    }
                    if(newpass=="" || newpass==undefined){
                        $scope.arr.push("密码不能为空");
                        $scope.qq=("密码不能为空");
                    }
                    if(newage=="" || newage==undefined){
                        $scope.arr.push("年龄不能为空");
                        $scope.ww=("年龄不能为空");
                    }
                    if(newsex=="" || newsex==undefined){
                        $scope.arr.push("性别必填");
                        $scope.ee=("性别必填");
                    }
                    if($scope.arr.length==0){
                    var pro={
                        id:$scope.add_id,
                        name:newname,
                        pass:$scope.add_pass,
                        age:$scope.add_age,
                        sex:$scope.add_sex
                    }
                    $scope.products.push(pro);
                    $scope.add_id="";
                    $scope.isshow=false;
                    }
                }
                
               //年龄区间查询
               $scope.nlsize=function(age){
                   if($scope.nl=="" || $scope.nl==undefined){
                       return true;
                   }else{
                       var arr=$scope.nl.split("-");
                       var max=arr[1];
                       var min=arr[0];
                       if(age>min && age<max){
                           return true;
                       }else{
                           return false;
                       }
                   }
               }
        //删除全部
        $scope.deleteAll=function(){
            $scope.products.splice(0);
        }
            //删除
            $scope.delProduct=function(clumn){
                var arr=[];
                if(confirm("您去定删除吗")){
                    for (index in $scope.products) {
                        if($scope.products[index].id==clumn){
                            $scope.products.splice(index,1);
                        }
                    }
                }
            }
            });
        
        </script>
    </head>
    <body ng-app="myApp" ng-controller="myCtrl">
        <center>
        <div class="aa">
            <h1>Air Show</h1>
        <input placeholder="gao" ng-model="search"/>
        <select ng-model="xbcx">
            <option value="">性别查询</option>
            <option>男</option>
            <option>女</option>
        </select>
        <select ng-model="nl">
            <option value="">年龄查找</option>
            <option>1-10</option>
            <option>10-20</option>
            <option>20-30</option>
        </select>
        <button ng-click="deleteAll()">删除全部</button>
        <button ng-click="delete()">批量删除</button><br /><br />
        <table border="1" cellpadding="10" cellspacing="0">
            <thead>
                <tr>
                    <th><input type="checkbox"></th>
                    <th>序号</th>
                    <th>姓名</th>
                    <th>密码</th>
                    <th>年龄</th>
                    <th>性别</th>
                    <th>操作</th>
                    <th>操作</th>
                </tr>
            </thead>
            <tbody>
                <tr ng-repeat="pro in products | filter:{name:search} | filter:{sex:xbcx}" ng-if="nlsize(pro.age)">
                    <td><input type="checkbox" ng-model="pro.state"></td>
                    <td>{{pro.id}}</td>
                    <td>{{pro.name}}</td>
                    <td>{{pro.pass}}</td>
                    <td><span ng-hide="xg">{{pro.age}}</span><span ng-show="xg"><input type="text" ng-model="pro.age"><button ng-click="xg=false">保存</button></span></td>
                    <td>{{pro.sex}}</td>
                    <td><button ng-click="xg=true">修改</button></td>
                    <td><button ng-click="delProduct(pro.id)">删除</button></td>
                </tr>
            </tbody>
        </table>
            <button ng-click="isshow=true">添加用户</button>
            <div ng-show="isshow">
                id<input type="text" ng-model="add_id"/><br />
                用户名<input type="text" ng-model="add_name"/><span ng-show="nn.length!=0" style="background-color: yellow" >{{nn}}</span><br />
                密码<input type="text" ng-model="add_pass"/><span ng-show="qq.length!=0" style="background-color: yellow">{{qq}}</span><br />
                年龄<input type="text" ng-model="add_age"/><span ng-show="ww.length!=0" style="background-color: yellow">{{ww}}</span><br />
                性别<input type="text" ng-model="add_sex"/><span ng-show="ee.length!=0" style="background-color: yellow">{{ee}}</span><br />
                <button ng-click="tj()">提交</button>
            </div>
            </div>
            </center>
    </body>
hey-solur
关注
anglur2.2.1 ng1
05-01
【标题】"AngularJS 1.x与Angular 2.2.1对比解析" 【描述】在Web开发领域，AngularJS 1.x（通常被称为Angular 1或ng1）与Angular 2.2.1（Angular 2或ng2）都是备受开发者喜爱的前端框架。尽管它们都属于Angular框架...
Angular Js 判断对象不为空对象的三种方法
Jarvis.y的博客
10-02 1237
前言 在写前端时，很多时候都需要去校验后端返回的数据是否是个空对象。这里就介绍三种方法 第一种 //将json对象转化为json字符串，再判断该字符串是否为"{}" JSON.stringify(data)=='{}' 第二种 //用getOwnPropertyNames方法获取到对象中的属性名，存到一个数组中，通过判断数组的length来判断此对象是否为空 Object.getOwnPropertyNames(data).length === 0 第三种 //使用ES6的Object.keys()方法
Anguler入门开发
Jack汪喆的技术分享栏
09-17 842
进行一下简单的Angular入门，开发第一版股票管理系统的静态页面布局。 一.Angular程序架构 Parent component:组件是Angular应用的基本构建块，你可以把一个组件理解为一段带有业务逻辑和数据的HTML Service1：服务用来封装可重用的业务逻辑 指令：允许你向HTML元素添加自定义行为 模块用来将应用中不同的部分组织成一个Angular框架可以理解的单元 ...
Angular学习总结-入门篇
小冷在努力~
12-06 9400
目录 一、Angular介绍 二、 学习Angular必备基础 三、 Angular环境搭建 四、 Angular创建项目 五、 Angular环境搭建以及创建项目的时候可能遇到的错误 六、Angular开发工具介绍 Angular项目结构介绍 创建组件/服务 angular语法 变量 ngFor循环+ngIf判断+ngSwitch 动态修改样式ngClass+ngStyle 双向数据绑定 管道(Pipe) 获取dom节点 ng...
1.anglurJS常用指令,自定义指令,连接代码块,控制器学习
hanchuang_hc的博客
02-21 511
我的第一篇博客
angular快速入门教程
热门推荐
h5_since的博客
03-10 1万+
angular快速入门
解决AngualrJS页面刷新导致异常显示问题
10-20
在AngularJS应用中，页面刷新有时会导致数据丢失或异常显示，这是因为AngularJS是单页应用程序（SPA），其依赖于浏览器的路由和控制器状态来管理页面的视图和数据。当用户按下F5键进行硬刷新时，浏览器会重新加载...
angular精品API
11-28
AngularJS 是一款强大的前端开发框架，由Google维护，主要用于构建单页应用（SPA，Single-Page Applications）。这个“angular精品API”压缩包包含了AngularJS的专业指导文件和源码，为开发者提供深入理解AngularJS ...
Angular-jss.zip
09-18
Angular-jss.zip,sitecore javascript服务正式回购sitecore javascript服务,Angularjs于2016年发布，是Angularjs的重写版。它专注于良好的移动开发、模块化和改进的依赖注入。angular的设计目的是全面解决开发人员的...
anguler js包
03-23
anguler js的本地引用文件，直接复制到项目中可用，无需解压。
fis3+anglurjs项目源码以及配置文件全解
11-18
fis3+anglurjs项目源码以及配置文件全解
Angular基本概念及用法总结
weixin_44801414的博客
07-27 5411
本文将用最简约的语言介绍angular的基本概念及相关快捷指令等，便于开发者快速入门学习以及日常工作中的使用。（ps笔记内容源于b站学习资源观后整理及个人总结。）selector'./myc01.component.html'，//或template}(3)使用已经注册过的组件(任意一个dom里，除了自己)...
Angular基础-搭建Angular运行环境
最新发布
踏雨歌青春，诗酒趁年华
05-02 7333
这篇文章介绍了在Angular项目中进行开发环境搭建的关键步骤。包括node.js安装和配置、安装Angular CLI工具、安装angular-router、创建Angular项目等步骤。这篇文章为读者提供了清晰的指南，帮助他们快速搭建Angular开发环境，为后续的项目开发奠定基础。
angular--安全导航操作符 ( ?. )、非空断言操作符（!） （实用）
chelen_jak的专栏
09-26 1889
原文出处：https://www.jianshu.com/p/1ccdc6a4d0ce 安全导航操作符 ( ?. ) Angular 的安全导航操作符 (?.) 是一种流畅而便利的方式，用来保护出现在属性路径中 null 和 undefined 值。 下例中，当currentHero为空时，保护视图渲染器，让它免于失败。 The current hero's name is {{curren...
深究AngularJS——校验（非form表单）
爱雨轩
05-13 4622
为什么是非form表单？因为基本上都是通$http服务异步发送与接收数据，没有form表单个一样可以。更何况，form表单的提交校验在哪里都可以搜索得到，我这个是通过自己总结出来滴。<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/
Angular判断对象不否为空的方法
小妖666个人笔记
10-25 4619
法一：将json对象转化为json字符串，再判断该字符串是否为"{}" JSON.stringify(params) === '{}' 法二：用getOwnPropertyNames方法获取到对象中的属性名，存到一个数组中，通过判断数组的length来判断此对象是否为空 Object.getOwnPropertyNames(params).length === 0 法三：使用ES6的O...
AngularJs必填、比较、格式验证
qq_31971935的博客
09-18 7088
界面： <form name="form" ng-submit="submitReg(tel,password,yzmsr,form)" novalidate="novalidate" > <!-- <h3><img src="/img/reh3.png" alt=""></h3> --> <div class="tb">
angularjs的添加和非空判断
weixin_39792151的博客
11-22 3388
//点击添加                     $scope.addll = function() {                         $scope.isshow = true;                     }                     //点击保存把数据提交到原始数据                      $scope.id="";
Angular.js中输入框非空验证----ng-if
stupider0623的博客
09-30 1406
&lt;!DOCTYPE html&gt;&lt;html&gt;&lt;head&gt;&lt;meta charset="utf-8"&gt;&lt;script src="../AngularJs/angular.js"&gt;&lt;/script&gt; &lt;/head&gt;&lt;body&gt;&lt;div
angularjs非空验证
qq_41651173的博客
01-19 1362
var app = angular.module("myapp", []);   app.controller("myctrl", function($scope) {    $scope.stu = [{     choose:false,      id: 2001,      tname: "iphonex",      name: "张三",      ipone: 13525565588
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值