<!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. 【BZOJ1087】[SCOI2005] 互不侵犯King（状压DP）

    点此看题面 大致题意: 在\(N×N\)的棋盘里面放\(K\)个国王,使他们互不攻击,共有多少种摆放方案(国王能攻击到它周围的8个格子). 状压\(DP\) 一看到这道题我就想到了经典的八皇后问题,但 ...

  2. vmware：使用.zip文件在vmware中安装操作系统

    问题描述: 之前在vmware中安装系统时,全部都是加载的.iso文件来实现.后面同事给了一个zip包,解压后是".vmdk"等一系列具体的文件.一时间不知道怎么安装系统了,搜网页 ...

  3. c++ 中十进制 八进制 十六进制 二进制转换 最简方法

    #include<iostream> using namespace std; int main() { int i; cin>>dec>>i; //cin> ...

  4. 梁勇Java语言程序设计第三章全部例题 为第五次作业

    完成例题3-1,通过系统当前时间毫秒值获取随机10以内的整数判断加的结果是否正确,不用if语句 package com.swift; import java.util.Scanner; public ...

  5. 【算法】Fibonacci（斐波那契数列）相关问题

    一.列出Fibonacci数列的前N个数 using System; using System.Collections.Generic; using System.Linq; using System ...

  6. node第一天

    一.主要执行的文件命名一般为main.js var aModule =require('./a.js');//相对路径 var aModule =require('a.js');//专门从node_m ...

  7. ajax 的 promise

    $.when().done().fail() $.when($.ajax("test1.html"),$.ajax("test2.html")).done(fu ...

  8. 多种语言书写 “ HelloWorld ”

    最基本的C: #include<stdio.h> int main(int argc, char const *argv[]) { printf("HelloWorld\n&qu ...

  9. SAP系统管理中常见问题解答（转载）

    1.如何查看SAP系统的位数? system——status看 Platform ID Platform 32-bit 64-bit --------------------------------- ...

  10. Zimber 8.8.12卸载后重新安装报错解决办法

    1.1  zimber故障处理步骤 1.1.1  现象描述 Running Post Installation Configuration: /opt/zimbra/bin/zmlocalconfig ...