<!DOCTYPE html>

<html lang="en" ng-app>

<head>

    <meta charset="UTF-8">

    <title>Title</title>

    <script type="text/javascript" src="../../jslib/angular.min-1.5.8.js"></script>

</head>

<body>

    <input ng-model="name" type="text" placeholder="姓名"><br/>

    <h1>Hello {{name}}</h1>

</body>

</html>
这个例子展示了AngularJs的数据绑定功能,输入框的值和{{name}}中的值动态绑定了,{{name}}会实时随着输入框的变化而变化

说明:
    script:引入AngularJS文件
    ng-app:该属性范围内都是属于AngularJs的内容,我现在在html标签中声明了此属性,就代表整个页面都是AngularJs应用
            我也可以在页面的一部分添加ng-app
    ng-module:是一个指令,将内部数据模型对象($scope)中的name属性绑定到文本输入框
            $scope:是一个简单的JavaScript对象,其中的属性可以被视图访问,也可以同控制器进行交互

AngularJs之HelloWorld的更多相关文章

  1. 初识AngularJS 之 HelloWorld和数据绑定

    1.Hello World 我用的开发工具是   atom   ,大家有需要的话可以找我要安装包嘻嘻 第一步: 写入以下代码: <!DOCTYPE html> <html ng-ap ...

  2. AngularJS输出helloworld

    AngularJS是什么? AngularJS是目前很火的前端JS框架之一, AngularJS的开发团队将其描述为一种构建动态Web应用的结构化框架.它是完全使用JavaScript编写的客户端技术 ...

  3. [转]怎么样快速入门AngularJS？

    本文转自:http://www.ngnice.com/posts/205af1ea1e13d2 怎么样快速学习AngularJS? 相信很多初学者都有过或者类似的疑问,其实这个问题没有标准的答案,每个 ...

  4. Freemarker教程1(基本使用)

    简介 FreeMarker是一款模板引擎: 即一种基于模板和要改变的数据, 并用来生成输出文本(HTML网页.电子邮件.配置文件.源代码等)的通用工具. 它不是面向最终用户的,而是一个Java类库,是 ...

  5. HowToDoInJava 其它教程 1 &#183; 翻译完成

    原文:HowToDoInJava 协议:CC BY-NC-SA 4.0 欢迎任何人参与和完善:一个人可以走的很快,但是一群人却可以走的更远. ApacheCN 学习资源 目录 Maven 教程 如何在 ...

  6. AngularJS 系列 01 - HelloWorld和数据绑定

    目录导读: AngularJS 系列 学习笔记 目录篇 前言: 好记性不如烂键盘,随笔就是随手笔记,希望以后有用. 本篇目录: 1. Hello World 2. AngularJS中的数据绑定 3. ...

  7. AngularJS基础01 从HelloWorld说起

    作者:arccosxy  转载请注明出处:http://www.cnblogs.com/arccosxy/ 准备工作 首先,创建一个名为index.html的HTML文件,代码如下: <!DOC ...

  8. Angular JS - 2 - angularjs helloworld

    材料下载  https://github.com/liuch0228/AngularJS-learn.git 1.使用原生jquery实现 实现输入框内容 在页面上跟随输入值动态更新 项目路径 < ...

  9. AngularJS 系列 学习笔记 目录篇

    目录: AngularJS 系列 01 - HelloWorld和数据绑定 AngularJS 系列 02 - 模块 (持续更新)

随机推荐

  1. NOIP2018赛前停课集训记（10.24~11.08）

    前言 为了不久之后的\(NOIP2018\),我们的停课从今天(\(Oct\ 24th\))起正式开始了. 本来说要下周开始的,没想到竟提早了几天,真是一个惊喜.毕竟明天有语文考试.后天有科学考试,逃 ...

  2. expect脚本中,变量的写法

    一.expect脚本中,变量的不同写法 shell脚本中定义时间变量的写法:time=`date "+%Y%m%d"` ==>>直接照搬到expect中,设置的变量是不 ...

  3. 破解 D-H 协议

    756: 破解 D-H 协议 时间限制: 1 Sec  内存限制: 128 MB提交: 78  解决: 18[提交] [状态] [讨论版] [命题人:admin] 题目描述 Diffie-Hellma ...

  4. Java时间为什么从1970-01-01 00:00:00 000开始

    不仅仅是Java,几乎所有的语言的时间都是从这一刻开始算起的. 原因:java起源于UNIX系统,而UNIX认为1970年1月1日0点是时间纪元. 最初计算机操作系统是32位,而时间也是用32位表示. ...

  5. GMap.Net解决方案之在WinForm和WPF中使用GMap.Net地图插件的开发

    在做地理位置相关的开发时,总是面临高额地图引擎费用让大部分用户望而却步,加之地图数据又是天价,那么GMap.NET就是首选了,它本身就是开源免费,服务器可以在本地缓存,以后访问时就可以直接访问. 可以 ...

  6. jenkins重置build序号

    来源:https://www.jianshu.com/p/e342b52d45e1 执行命令:item = Jenkins.instance.getItemByFullName("your- ...

  7. Mybatis 插入一条或批量插入 返回带有自增长主键记录

    首先讲一下,  插入一条记录返回主键的 Mybatis 版本要求低点,而批量插入返回带主键的 需要升级到3.3.1版本,3.3.0之前的都不行, <dependency> <grou ...

  8. git bash学习3 -简单杂乱知识点记录

    branch 新建分支 git init git add git commit 先新建一个仓库以及master 然后新建分支 git branch BranchName 然后切换分支 git chec ...

  9. 重置 nexus3 admin 密码

    2 简单 3 重构,变化很大 如何处理nexus3忘记admin密码 - CSDN博客 https://blog.csdn.net/tianya6607/article/details/5330562 ...

  10. 用jq给img添加error事件

    <img src="xxxx.jpg" alt="" /> <script> $(document).ready(function(){ ...