1、AngularJS HTML DOM
　　AngularJS 为 HTML DOM 元素的属性提供了绑定应用数据的指令。

　　　　ng-disabled 指令：ng-disabled 指令直接绑定应用程序数据到 HTML 的 disabled 属性。
　　　　ng-show 指令：ng-show 指令隐藏或显示一个 HTML 元素。
　　　　ng-hide 指令：ng-hide 指令用于隐藏或显示 HTML 元素。

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <script src="js/angular.min.js"></script>

</head>

<body>

    <div ng-app="myApp" ng-controller="myCtrl">

        <!-- ng-disabled 指令 -->

        <p>

            <button ng-disabled="mySwitch">点我!</button>

        </p>

        <p>

            <input type="checkbox" ng-model="mySwitch">按钮

        </p>

        <p>

            {{ mySwitch }}

        </p>

        <!-- ng-show 指令 -->

        <p ng-show="true">我是可见的。</p>

        <p ng-show="false">我是不可见的。</p>

        <!-- ng-hide 指令 -->

        <p ng-hide="true">我是不可见的。</p>

        <p ng-hide="false">我是可见的。</p>

    </div>

</body>

</html>

<script>

    var app = angular.module('myApp', []);

    app.controller('myCtrl', function ($scope) {

        $scope.firstName = "John";

        $scope.lastName = "Doe";

    });

</script>

AngularJS学习之旅—AngularJS HTML DOM(十三)的更多相关文章

  1. AngularJS学习之旅—AngularJS 模块(十五)

    一.AngularJS 模块 模块定义了一个应用程序. 模块是应用程序中不同部分的容器. 模块是应用控制器的容器. 控制器通常属于一个模块. 1.创建模块 通过 AngularJS 的 angular ...

  2. AngularJS学习之旅—AngularJS 控制器(六)

    1.AngularJS 控制器 AngularJS 应用程序被控制器控制. ng-controller 指令定义了应用程序控制器. 控制器是 JavaScript 对象,由标准的 JavaScript ...

  3. AngularJS学习之旅—AngularJS 指令(三)

    1.AngularJS 指令 AngularJS 通过被称为 指令 的新属性来扩展 HTML. AngularJS 通过内置的指令来为应用添加功能. AngularJS 允许你自定义指令.2.Angu ...

  4. AngularJS学习之旅—AngularJS 表达式(二)

    1.AngularJS 表达式 AngularJS 表达式写在双大括号内:{{ expression }}. AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙 ...

  5. AngularJS学习之旅—AngularJS 服务(八)

    1.AngularJS 服务(Service) AngularJS 中你可以创建自己的服务,或使用内建服务.2.什么是服务? 在 AngularJS 中,服务是一个函数或对象,可在你的 Angular ...

  6. AngularJS学习之旅—AngularJS Scope作用域(五)

    1.AngularJS Scope(作用域) Scope(作用域) 是应用在 HTML (视图) 和 JavaScript (控制器)之间的纽带. Scope 是一个对象,有可用的方法和属性. Sco ...

  7. AngularJS学习之旅—AngularJS 表单(十六)

    一.AngularJS 表单 AngularJS 表单是输入控件的集合. HTML 控件 以下 HTML input 元素被称为 HTML 控件: input 元素 select 元素 button ...

  8. AngularJS学习之旅—AngularJS 事件(十四)

    1.AngularJS 事件 ng-click ( 适用标签 :所有,触发事件:单击): ng-dblclick( 适用标签 :所有,触发事件:双击): ng-blur(适用标签 : a,input, ...

  9. AngularJS学习之旅—AngularJS Table(十一)

    1.AngularJS 表格 1. ng-repeat 指令可以完美的显示表格 AngularJS 实例 <!DOCTYPE html> <html> <head> ...

随机推荐

  1. java热加载和热部署

    JAVA热部署和热加载 联系与区别 Java热部署与热加载的联系 1.不重启服务器编译/部署项目 2.基于Java的类加载器实现 区别 部署方式 热部署在服务器运行时重新部署项目 热加载在运行时重新加 ...

  2. 一文掌握 Linux 性能分析之网络篇

    本文首发于我的公众号 Linux云计算网络(id: cloud_dev),专注于干货分享,号内有 10T 书籍和视频资源,后台回复「1024」即可领取,欢迎大家关注,二维码文末可以扫. 这是 Linu ...

  3. Hadoop源码篇--Reduce篇

    一.前述 Reduce文件会从Mapper任务中拉取很多小文件,小文件内部有序,但是整体是没序的,Reduce会合并小文件,然后套个归并算法,变成一个整体有序的文件. 二.代码 ReduceTask源 ...

  4. Python实现 Typora数学公式 转 有道云笔记Markdown数学公式

    话不多说上代码,可以按照自己的需求把匿名函数改成普通函数,改不来的可以加我微信我帮你改. 块状数学公式转换 import re test_str = r''' $D={\{\vec{x_1},\vec ...

  5. .NET Core实战项目之CMS 第十四章 开发篇-防止跨站请求伪造（XSRF/CSRF）攻击处理

    通过 ASP.NET Core,开发者可轻松配置和管理其应用的安全性. ASP.NET Core 中包含管理身份验证.授权.数据保护.SSL 强制.应用机密.请求防伪保护及 CORS 管理等等安全方面 ...

  6. solr之环境配置二

    安装配置Tomcat 下载Tomcat压缩包 我下载的是7.0.55版本. 1.Tomcat 7.0 的免安装版的配置(假如将Tomcat 解压到C:\Program Files目录,目录结构为:C: ...

  7. ES 04 - 安装Kibana插件(6.6.0版本)

    目录 1 Kibana是什么 2 安装并启动Kibana 2.1 准备安装包 2.2 修改配置文件 2.3 启动Kibana并验证 2.4 关闭Kibana服务 3 Kibana功能测试 3.1 关于 ...

  8. 从零打卡leetcode之day 2---两数相加

    前言 就是要把leetcode刷完,每天一道题,每天进步一点点. 从零打卡leetcode之day 2 题目描述: 给定两个非空链表来表示两个非负整数.位数按照逆序方式存储, 它们的每个节点只存储单个 ...

  9. Linux系统的数据写入机制--延迟写入

    我们都知道,在Linux关机的之前都会要运行一个命令那就是sync,这个命令是同步的意思,那为什么要运行这个?而且之前的数据改变我们已经看见了,为什么还要运行这个命令?要回答这个问题就要说一下Linu ...

  10. Chapter 4 Invitations——14

    "Hi, Bella." “你好,Bella” "What's up?" I said as I was unlocking the door. “怎么了?” ...