三种方式：

  • 方式一：<h5>{{msg}}</h5>  此方式在页面刷新的时候会闪现{{}}
  • 方式二：<h5 ng-bind="msg"></h5>
  • 方式三：<h5 ng-clock class="ng-clock">{{msg}}</h5>

示例代码：

<!DOCTYPE html>

<html lang="en" ng-app="myapp">

<head>

    <meta charset="UTF-8">

    <title>AngularJs12-实现数据绑定的三种方式</title>

    <link rel="stylesheet" href="http://cdn.bootcss.com/bootstrap/4.0.0-alpha.2/css/bootstrap.min.css"/>

</head>

<body>

    <div ng-controller="MyCtrl" style="padding: 60px;">

        <input type="text" class="form-control" ng-model="msg">

        <!-- 方式1 -->

        <h5>{{msg}}</h5>

        <!-- 方式2 -->

        <h5 ng-bind="msg"></h5>

        <!-- 方式3 -->

        <h5 ng-clock class="ng-clock">{{msg}}</h5>

    </div>

    <script src="http://apps.bdimg.com/libs/angular.js/1.4.6/angular.min.js"></script>

    <script>

        angular.module('myapp',[])

        .controller('MyCtrl',function($scope){

            $scope.msg = 'Hello Angular!'

        })

     </script>

</body>

</html>

AngularJs学习——实现数据绑定的三种方式的更多相关文章

  1. 【转】Spring学习---Bean配置的三种方式（XML、注解、Java类）介绍与对比

    [原文]https://www.toutiao.com/i6594205115605844493/ Spring学习Bean配置的三种方式(XML.注解.Java类)介绍与对比 本文将详细介绍Spri ...

  2. PHP的学习--连接MySQL的三种方式

    记录一下PHP连接MySQL的三种方式. 先mock一下数据,可以执行一下sql. /*创建数据库*/ CREATE DATABASE IF NOT EXISTS `test`; /*选择数据库*/ ...

  3. Spring学习（二）三种方式的依赖注入

    1.前言 上一篇讲到第一个Spring项目的创建.以及bean的注入.当然.注入的方式一共有三种.本文将展开细说. 1.set注入:本质是通过set方法赋值 1.创建老师类和课程类 1.Course ...

  4. 【Android学习】数据传递三种方式

    1.Application 注意在清单文件中的Application节点下注册android:name属性, 继承Application类,重写onCreate方法, 使用数据时,实例化自定义类时需要 ...

  5. AngularJs中关于ng-class的三种使用方式说明

    在开发中我们通常会遇到一种需求:一个元素在不同的状态需要展现不同的样子. 而在这所谓的样子当然就是改变其css的属性,而实现能动态的改变其属性值,必然只能是更换其class属性 这里有三种方法: 第一 ...

  6. angularjs 自定义服务的三种方式

    angularjs 中可通过三种($provider,$factory,$service)方式自定义服务,以下是不同的实现形式: // 定义module , module中注入$providevar ...

  7. ios网络学习------4 UIWebView的加载本地数据的三种方式

    ios网络学习------4 UIWebView的加载本地数据的三种方式 分类: IOS2014-06-27 12:56 959人阅读 评论(0) 收藏 举报 UIWebView是IOS内置的浏览器, ...

  8. java核心知识点学习----创建线程的第三种方式Callable和Future CompletionService

    前面已经指出通过实现Runnable时,Thread类的作用就是将run()方法包装成线程执行体,那么是否可以直接把任意方法都包装成线程执行体呢?Java目前不行,但其模仿者C#中是可以的. Call ...

  9. 0036 Java学习笔记-多线程-创建线程的三种方式

    创建线程 创建线程的三种方式: 继承java.lang.Thread 实现java.lang.Runnable接口 实现java.util.concurrent.Callable接口 所有的线程对象都 ...

随机推荐

  1. java入门---windows和Linux，UNIX，Solaris，FreeBSD下开发环境配置

        首先来看Windows下的操作.我们需要下载java开发工具包JDK.下载地址:http://www.oracle.com/technetwork/java/javase/downloads/ ...

  2. mysql用命令创建用户创建数据库设置权限

     1.create database bbs; //创建数据库 2.create user bbs IDENTIFIED by 'bbs';  //创建用户bbs和登录密码bbs 3.grant AL ...

  3. VS2017发布微服务到docker

    1.本文档以eShopOnContainers.sevices.identity为描述对象,并包含docker for windows的部分配置流程. 2.前置环境:win10操作系统.安装VS201 ...

  4. 转载：Linux系统和Linux系统之间如何实现文件传输

    两台Linux系统之间传输文件 听语音 | 浏览:13183 | 更新:2014-07-15 15:22 | 标签:linux 1 2 3 4 5 6 分步阅读 如何在Linux系统之间传输文件及文件 ...

  5. 实用脚本 4 -- Makefile(不同文件下的多个可执行文件or静态库编译到同一目录下)

    不同文件下的多个可执行文件编译到同一目录下,这样方便观察编译结果,从而方便进程操作.使用时根据自己的需要在进行局部修改(如 链接库.目标文件等等). 1..bashrc 中设置编译主目录(例如) ex ...

  6. itop-4412开发板使用第一篇-信号量的学习使用

    1. 本次基于itop-4412研究下Linux信号量的使用方法. 2. 创建信号量的函数,信号量的头文件在那个路径?编译应用程序的话,头文件有3个路径,内核源码头文件,交叉编译器头文件,ubuntu ...

  7. Java Web前后端分离的思考与实践

    第一节 Java Web开发方式的变化 Web开发虽然是我们常说的B/S模式,其实本质上也是一种特殊的C/S模式,只不过C和S的选择余地相对要窄了不少,而且更标准化.不论是采用什么浏览器和后端框架,W ...

  8. ASP.NET MVC 使用jquery.form.js 异步上传 在IE下返回值被变为下载的解决办法

    错误记录: <script type="text/javascript"> $(function () { $(document).off("ajaxSend ...

  9. 剑指offer-调整数组顺序使奇数位于偶数前面13

    题目描述 输入一个整数数组,实现一个函数来调整该数组中数字的顺序,使得所有的奇数位于数组的前半部分,所有的偶数位于数组的后半部分,并保证奇数和奇数,偶数和偶数之间的相对位置不变. class Solu ...

  10. win10激活方法-专业版

    该教程操作思路,Win10家庭版升为专业版,然后激活版本 首先,进入设置→关于看到如下页面: 接着,进入实操阶段: 第一步   在激活版面输入密匙   ( 把家庭版升级为专业版 ) DR9VN-GF3 ...