angularjs2 ng2 密码隐藏显示
2021-06-17 20:04
标签：span 用户输入 图标 bsp 点击事件 type ges 效果图 angular 代码结合ionic2开发移动端项目，注册页的密码的input一般用password， 但是用户输入密码时可能会输入错误，需要显示成text。 如图： 首先，输入框的类型判断； 然后，添加眼睛的点击事件，ngClass判断图标样式； 最后，附上ngClass的样式，图标的隐藏显示。 下面附上效果图啦哈哈。。 初始状态效果图 打开眼睛之后效果图 angularjs2 ng2 密码隐藏显示 标签：span 用户输入 图标 bsp 点击事件 type ges 效果图 angular 原文地址：http://www.cnblogs.com/luciahuang/p/7264977.html
1 ion-input type="{{pwshow?‘text‘:‘password‘}}" placeholder="输入密码">ion-input>
1 a href="javascript:;"item-end (click)="pwshow=!pwshow" [ngClass]="pwshow?‘eyeshow‘:‘eyehide‘">
2 ion-icon name="ios-eye-off" color="dark" class="eye-hide">ion-icon>
3 ion-icon name="ios-eye" color="dark" class="eye-show">ion-icon>
4 a>
1 .eyehide .eye-hide, .eyeshow .eye-show{
2 display: block;
3}
4.eyehidee .eye-show, .eyeshow .eye-hide{
5 display: none;
6}
上一篇：HTML 初识
文章标题：angularjs2 ng2 密码隐藏显示
文章链接：http://soscw.com/index.php/essay/95190.html