<div class="row ng-scope">
<div class="col-lg-12">
<h1 class="page-header">详细信息</h1>
</div>
<!-- /.col-lg-12 -->
</div>
<div class="panel panel-default">
<div class='panel-heading'>
<div class="btn-group pull-right">
<a ng-click="selectType=1" class="btn btn-primary btn-xs"><span class="glyphicon glyphicon-edit"></span></a>
<a ng-click="selectType=0" class="btn btn-success btn-xs"><span class="glyphicon glyphicon-ok"></span></a>
</div>个人资料
</div>
<div class="panel-body">
<div class="row">
<div class="col-lg-6 panel-body">
<div class="form-group">
<div style='position: relative;margin: 7px 13px;' class='todo-item' ng-hide="selectType" ng-class="{'todo-complete': item.complete}">
<p>{{user.model.username}}</p>
</div> <div class='todo-item' ng-show="selectType">
<input type="text" class="form-control" ng-model="user.model.username" ng-class="{'todo-complete': item.complete}"/>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6 panel-body">
<div class="form-group">
<div style='position: relative;margin: 7px 13px;' class='todo-item' ng-hide="selectType">
<p>{{user.model.email}}</p>
</div> <div class='todo-item' ng-show="selectType">
<input type="email" class="form-control" ng-model="user.model.email" required/>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-lg-6 panel-body">
<div style='position: relative;margin: 7px 13px;' class='todo-item' ng-hide="selectType">
<p>******</p>
</div> <div class='todo-item' ng-show="selectType">
<input type="password" ng-model="user.model.password" placeholder='Reset User password' required/>
</div>
</div>
</div>
</div>

通过修改selectType切换ng-hide,ng-show改变内部文本

[angularJS]ng-hide|ng-show切换的更多相关文章

  1. angular 中怎么获取路径上的参数 参考:https://docs.angularjs.org/api/ng/service/$location

    参考: https://docs.angularjs.org/api/ng/service/$location

  2. AngularJS实现可伸缩的页面切换

    AngularJS实现可伸缩的页面切换 AngularJS 1.2 通过引入基于纯CSS class的切换和动画,在一个单页面应用创建页面到页面的切换变得更加的容易.只需要使用一个ng-view,让我 ...

  3. Part 14 ng hide and ng show in AngularJS

    ng-hide and ng-show directives are used to control the visibility of the HTML elements. Let us under ...

  4. Angularjs checkbox的ng属性

    angularjs 默认给 input[checkbox] 元素定制了一些属性,如: <input type="checkbox" ng-mudel="name&q ...

  5. 【AngularJs】---"Error: [ng:areq] Argument 'fn' is not a function, got undefined"

    项目中把controller.service抽取出来 一步一步没有报错 index那里加 <script src="js/controllers/XXController.js&quo ...

  6. Angular6之ng build | ng build --aot | ng build --prod 差异

    由于写了大半年的项目终于要告一段落并且即将进行第二阶段优化开发,emmm 基础版本已经二十多个模块了,必不可少的优化是很重要的,尽管项目上使用多层嵌套懒加载,但是在首屏加载的时候,任然很慢啊,因为一直 ...

  7. [Ng]Angular应用点概览

      1. 使用模块化写法. var app = angular.module('myApp', []); app.controller('TextController', function($scop ...

  8. ng指令之 ng-class 篇

    1>定义和用法 ng-class 指令用于给 HTML 元素动态绑定一个或多个 CSS 类.ng-class 指令的值可以是字符串,对象,或一个数组. 如果是字符串,多个类名使用空格分隔. 如果 ...

  9. Flume NG Getting Started(Flume NG 新手入门指南)

    Flume NG Getting Started(Flume NG 新手入门指南)翻译 新手入门 Flume NG是什么? 有什么改变? 获得Flume NG 从源码构建 配置 flume-ng全局选 ...

  10. ng环境搭建步骤

    1,安装node node -v查看版本号 2,安装淘宝镜像 npm config set registry https://registry.npm.taobao.org 3,安装cnpm npm ...

随机推荐

  1. Cookie 和 Session 有什么区别呢?

    Cookie 和 Session 有什么区别呢?大部分的面试者应该都可以说上一两句,比如:什么是 Cookie?什么是 Session?两者的区别等 但如果再往深入探讨的话,就慢慢有一些朋友不太了解了 ...

  2. DFS与BFS对比

    前面已经说过了深搜和广搜了,是不是有点还不是很好的分清他们?(其实分不分的请都没大有关系) 下面我们来看一看广搜与深搜的区别吧. 算法步骤上的区别 深度优先遍历图算法步骤: 1.访问顶点v 2,.依次 ...

  3. Linux服务器同步网络时间

    Linux服务器运行久时,系统时间就会存在一定的误差,一般情况下可以使用date命令进行时间设置,但在做数据库集群分片等操作时对多台机器的时间差是有要求的,此时就需要使用ntpdate进行时间同步. ...

  4. C语言枚举类型(Enum)

    在实际编程中,有些数据的取值往往是有限的,只能是非常少量的整数,并且最好为每个值都取一个名字,以方便在后续代码中使用,比如一个星期只有七天,一年只有十二个月,一个班每周有六门课程等. 以每周七天为例, ...

  5. 手机加载优化 - 2x、3x图

    人们常说,现在的流量不值钱了,图越大越好咯! 我想说的是,浏览器虽然不值钱了,但速度还是略快吧! 文章来自:UI妹儿 icon_alipay.png→iPhone 1-3代的手机(已经不考虑了) ic ...

  6. java开始到熟悉60

    本次主题:多维数组 1,多维数组的初始话有三种:默认初始化.静态初始化.动态初始化. 这里只讲解静态初始化: 这里以二位数组为例,实际应用中,一维用得最多,二维次之,三维以及三维以上几乎很少使用,而且 ...

  7. Intel processor brand names-Xeon,Core,Pentium,Celeron----Atom

    http://en.wikipedia.org/wiki/Intel_atom Intel Atom From Wikipedia, the free encyclopedia   (Redirect ...

  8. linux 输入子系统(3) button platform driver

    button platform driver 一般位于driver/input/keyboard/gpio_keys.c /*用于按键事件的上报,它将在按键的中断发生后被调用.其中逻辑就是获取到按键类 ...

  9. (转载)常用的Mysql数据库操作语句大全

    打开CMD,进入数据库命令:mysql -hlocalhost -uroot -p 退出数据库:exit 用户管理: 1.新建用户: >CREATE USER name IDENTIFIED B ...

  10. Python开发【深浅拷贝】

    1.==与is a = [1,2] b = [1,2] a==b >>>True a is b >>>False 2.拷贝与非拷贝 拷贝:原则上就是把数据分离出来, ...