博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
AngularJS简单例子
阅读量:5097 次
发布时间:2019-06-13

本文共 919 字,大约阅读时间需要 3 分钟。

双大括号标记{
{}}
绑定的表达式

<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>

结果值同上

转载于:https://www.cnblogs.com/rdchen/p/10784426.html

你可能感兴趣的文章
[Android] 开发第十天
查看>>
操作~拷贝clone()
查看>>
Java开发中的23种设计模式
查看>>
jQuery源码分析(2) - 为什么不用new jQuery而是用$()
查看>>
[转]【EL表达式】11个内置对象(用的少) & EL执行表达式
查看>>
ArrayList对象声明& arrayList.size()
查看>>
并发编程 线程
查看>>
Mysql 解压安装
查看>>
Mysql
查看>>
前端html
查看>>
网络编程
查看>>
关于“设计模式”和“设计程序语言”的一些闲话
查看>>
(一二九)获取文件的MineType、利用SSZipArchive进行压缩解压
查看>>
python学习4 常用内置模块
查看>>
Window7上搭建symfony开发环境(PEAR)
查看>>
ResolveUrl的用法
查看>>
Linux内核态、用户态简介与IntelCPU特权级别--Ring0-3
查看>>
第23月第24天 git命令 .git-credentials git rm --cached git stash clear
查看>>
华为离职副总裁徐家骏:年薪千万的工作感悟
查看>>
java SE :标准输入/输出
查看>>