三种方式：

  • 方式一：<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. maven之package与install的区别

    mvn clean package 先看命令的执行过程 mvn clean install 同样先看执行过程 mvn clean package依次执行了clean.resources.compile ...

  2. React实现最完整的百度搜索框

    import React,{Component} from 'react' import ReactDOM,{render} from 'react-dom' import 'bootstrap/di ...

  3. NOI2018 游记

    day-2 飞向长沙 上午收拾了收拾东西,下载了动画<爱吃拉面的小泉同学>的前五集. 吃过午饭,就准备坐车去运城机场.高铁飞速,转眼间就到了.我没坐过几次飞机,而且比较恐飞,就很难受qwq ...

  4. 「日常训练」 Soldier and Traveling (CFR304D2E)

    题意 (CodeForces 546E) 对一个无向图,给出图的情况与各个节点的人数/目标人数.每个节点的人只可以待在自己的城市或走到与他相邻的节点. 问最后是否有解,输出一可行解(我以为是必须和答案 ...

  5. Python-学习-import语句导入模块

    简单的学习一下调用外部的模块文件. 在Python中,模块是一种组织形式,它将彼此有关系的Pyrhon 代码组织到一个个独立的文件当中,模块可以包含可执行代码,函数,和类或者是这些东西的组合. 当我们 ...

  6. python 学习总结----正则表达式

    正则表达式 应用场景 - 特定规律字符串的查找,切割,替换 - 邮箱格式:URl,IP地址等的校验 - 爬虫项目中,特定内容的提取 使用原则 - 只要使用字符串等函数能解决的问题,就不要使用正则 - ...

  7. oracle 数据库字段名与实体类字段名称不匹配的处理方法

    之前公司一直都使用sql server 即使数据库字段名称与实体类名称不相同 可以使用诸如: select id as userId from tb_user 这种写法,可换到了oracle 之后坑爹 ...

  8. 为什么mysqld启动报错

    在一台ubuntu测试机器上启动一个mysql实例,本来应该是一件很简单的事情, 启动的时候却报错了:   mysqld_safe --defaults-file=/etc/mysql/my3307. ...

  9. 图解Transformer

    图解Transformer 前言 Attention这种机制最开始应用于机器翻译的任务中,并且取得了巨大的成就,因而在最近的深度学习模型中受到了大量的关注.在在这个基础上,我们提出一种完全基于Atte ...

  10. redis安装与启动

    安装简介: 在安装redis前需要了解redis官方发布时的版本规则,redis官方约定次版本号(即第一个小数点后的数字)为偶数的版本是稳定版(如2.8版,3.0版),奇数版本则为非稳定版本(如2.7 ...