AngularJS简单例子
双大括号标记{{}}绑定的表达式
<html ng-app>
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
最后,标签中的正文是应用的模板,在UI中显示我们的问候语:
Hello {{'World'}}!
结果:结果直接输出World
AngularJS双向数据绑定
<!doctype html>
<html ng-app>
<head>
<script src="http://code.angularjs.org/angular-1.0.1.min.js"></script>
</head>
<body>
Your name: <input type="text" ng-model="yourname" placeholder="World">
<hr>
Hello {{yourname || 'World'}}!
</body>
</html>
{{yourname || 'World'}}!中的yourname将根据ng-model的值动态的改变,如果ng-model为空,则仅仅输出World
语法或指令
Ng-Bing, ng-init
<body ng-app>
<b ng-init="name='crd'"></b>
<div ng-bind="name">dsdfdsf</div>
</body>
Div的值将输出crd 原值dsdfdsf被覆盖
HTML5 允许扩展的(自制的)属性,以 data- 开头。
AngularJS 属性以 ng- 开头,但是您可以使用 data-ng- 来让网页对 HTML5 有效。
带有有效的 HTML5:
AngularJS 实例
<div data-ng-app="" data-ng-init="firstName='John'">
<p>姓名为 <span data-ng-bind="firstName"></span></p>
</div>
结果值同上
AngularJS简单例子的更多相关文章
- Hibernate4.2.4入门(一)——环境搭建和简单例子
一.前言 发下牢骚,这段时间要做项目,又要学框架,搞得都没时间写笔记,但是觉得这知识学过还是要记录下.进入主题了 1.1.Hibernate简介 什么是Hibernate?Hibernate有什么用? ...
- AgileEAS.NET SOA 中间件平台.Net Socket通信框架-简单例子-实现简单的服务端客户端消息应答
一.AgileEAS.NET SOA中间件Socket/Tcp框架介绍 在文章AgileEAS.NET SOA 中间件平台Socket/Tcp通信框架介绍一文之中我们对AgileEAS.NET SOA ...
- spring mvc(注解)上传文件的简单例子
spring mvc(注解)上传文件的简单例子,这有几个需要注意的地方1.form的enctype=”multipart/form-data” 这个是上传文件必须的2.applicationConte ...
- ko 简单例子
Knockout是在下面三个核心功能是建立起来的: 监控属性(Observables)和依赖跟踪(Dependency tracking) 声明式绑定(Declarative bindings) 模板 ...
- mysql定时任务简单例子
mysql定时任务简单例子 ? 1 2 3 4 5 6 7 8 9 如果要每30秒执行以下语句: [sql] update userinfo set endtime = now() WHE ...
- java socket编程开发简单例子 与 nio非阻塞通道
基本socket编程 1.以下只是简单例子,没有用多线程处理,只能一发一收(由于scan.nextLine()线程会进入等待状态),使用时可以根据具体项目功能进行优化处理 2.以下代码使用了1.8新特 ...
- 一个简单例子:贫血模型or领域模型
转:一个简单例子:贫血模型or领域模型 贫血模型 我们首先用贫血模型来实现.所谓贫血模型就是模型对象之间存在完整的关联(可能存在多余的关联),但是对象除了get和set方外外几乎就没有其它的方法,整个 ...
- [转] 3个学习Socket编程的简单例子:TCP Server/Client, Select
以前都是采用ACE的编写网络应用,最近由于工作需要,需要直接只用socket接口编写CS的代码,重新学习这方面的知识,给出自己所用到的3个简单例子,都是拷贝别人的程序.如果你能完全理解这3个例子,估计 ...
- jsonp的简单例子
jsonp的简单例子 index.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8&q ...
随机推荐
- 导出excel 文件
---恢复内容开始--- 安装 pip install xlwt ---恢复内容结束---
- 在vue-cli3 中import引入一个没有export default{}的js文件
如果这个js文夹,放在vue-cli3中搭建的项目中的,public文件夹下,通过 //.js可以省略不行 import '/public/xxx.js' 其实你在浏览器中看的时候,发现会报错误 : ...
- 将Emacs Org任务树导出至Freeplane思维导图
Emacs Org mode作为实施GTD方法的任务与项目管理工具是极为强大和有效的.尽管如此,我在使用过程中亦发现了一个因Emacs文本操作模式而难以解决的情况,即对于具有复杂结构与大量细节的项目, ...
- 继承了AppCompatActivity的全屏设置
v7下全屏设置:getSupportActionBar().hide();getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN ...
- java 安装以及配置
1.下载 JDK 下载地址:https://www.oracle.com/technetwork/java/javase/downloads/index-jsp-138363.html 2.环境变量配 ...
- BZOJ4259 残缺的字符串 多项式 FFT
原文链接http://www.cnblogs.com/zhouzhendong/p/8798532.html 题目传送门 - BZOJ4259 题意 给你两个串,用其中一个来匹配另一个.问从母串的那些 ...
- easyui提交form表单接受数据处理、
$('#Form').form('submit', { url:"withdrawal/bankAuthenticate4List.do", onSubmit: function( ...
- PID控制算法的简单分析和仿真!
PID算法简单剖析如下: 1.首先我们来看一下PID系统的基本组成模块: 如图所示,图中相关参数的表示如下: r(t):系统实际上需要的输出值,这是一个标准值,在我们设定了之后让这个系统去逼近的一个值 ...
- (三)ajax请求不同源之jsonp跨域
凡是拥有"src"这个属性的标签都具有跨域的能力,比如<script>.<img>.<iframe>. JS中,我们直接用XMLHttpRequ ...
- 一文搞定scrapy爬取众多知名技术博客文章保存到本地数据库,包含:cnblog、csdn、51cto、itpub、jobbole、oschina等
本文旨在通过爬取一系列博客网站技术文章的实践,介绍一下scrapy这个python语言中强大的整站爬虫框架的使用.各位童鞋可不要用来干坏事哦,这些技术博客平台也是为了让我们大家更方便的交流.学习.提高 ...