<!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. 【洛谷4657】[CEOI2017] Chase（一个玄学的树形DP）

    点此看题面 大致题意: 有一棵树,树上编号为\(i\)的节点上有\(F_i\)个铁球,逃亡者有\(V\)个磁铁,当他在某个节点放下磁铁时,与这个节点相邻的所有节点上的铁球都会被吸引到这个节点.然后一个 ...

  2. Linux 下MySQL数据库配置远程访问

    1. mysql -u root -p 第一次直接回车跳过密码 2. use mysql; 3.执行授权命令 GRANT ALL PRIVILEGES ON *.* TO 'root'@'%' IDE ...

  3. javaweb基础(29)_EL表达式

    一.EL表达式简介 EL 全名为Expression Language.EL主要作用: 1.获取数据 EL表达式主要用于替换JSP页面中的脚本表达式,以从各种类型的web域 中检索java对象.获取数 ...

  4. 【luogu P3609 [USACO17JAN]Hoof, Paper, Scissor蹄子剪刀布】 题解

    题目链接:https://www.luogu.org/problemnew/show/P3609 ### 看着标签什么记搜什么暴力点进来,读完题第一直觉DP? 还真是个\(DP\). 题目所描述的状态 ...

  5. BeyondCompare：如何之比较文件内容的不同？

    问题描述: 在使用beyond compare比较文件的时候,常会有很多不同,但是点击打开后,发现内容没有不同.这个是因为工具把文件的日期.大小等非内容因素也比较了进去. 解决方法: 点击“会话” - ...

  6. vue学习之路 - 4.基本操作（下）

    vue学习之路 - 4.基本操作(下) 简述:本章节主要介绍 vue 的一些其他常用指令. Vue 指令 这里将 vue 的指令分为系统内部指令(vue 自带指令)和用户自定义指令两种. 系统内部指令 ...

  7. WebSocket 详解

    WebSocket 出现前 构建网络应用的过程中,我们经常需要与服务器进行持续的通讯以保持双方信息的同步.通常这种持久通讯在不刷新页面的情况下进行,消耗一定的内存资源常驻后台,并且对于用户不可见.在 ...

  8. ATM-lib-common

    import logging.configfrom conf import settingsfrom core import src def get_logger(name): logging.con ...

  9. Missian指南三：创建一个Missian服务器（使用spring）

    在使用Missian时,spring是可选的,但是作者本人强烈推荐和Spring配合使用.Spring是一个伟大的项目,并且它不会对程序在运行时的效率带来任何损耗. Missian在服务器端依赖与Mi ...

  10. Python3爬取起猫眼电影实时票房信息，解决文字反爬~~~附源代码

    上文解决了起点中文网部分数字反爬的信息,详细链接https://www.cnblogs.com/aby321/p/10214123.html 本文研究另一种文字反爬的机制——猫眼电影实时票房反爬 虽然 ...