`
gaofan0528
  • 浏览: 17093 次
社区版块
存档分类
最新评论

angularjs表达式

 
阅读更多

AngularJs 简介

 

AngularJs是一个JavaScript框架,它是一个JavaScript编写的库

 

 

需要引入文件   像jQuery一样可以引入网上的也可以引下载好本地的文件

 

 

ng-app是告诉这是AngularJs应用程序

ng-model把元素值绑定到应用程序.

ng-bind把应用程序数据绑定到html视图

<div ng-init="firstName=''" ng-app=''>
        <p>姓名:<input type="text" ng-model="firstName" ></p>
        <p>名字{{  firstName }}</p>

//这样我们在input框输入的名字会在   名字的P标签显示出来   
//ng-app是告诉angularjs这是一个angular控制的

 

如果你整个html文件都是用angularjs写的那么可以用一个ng-app就可以
ng-app写在body

<body ng-app" ">

这样代表这个页面都是angular

 

在表达式{{ }}里也可以写运算  

{{ 5*6 }}

 

ng-init是初始化  也就是刚开始的时候显示什么

<div ng-init="qty=1;cost=2"><!--里边的值是初始化的时候显示什么-->
    <b>订单:</b>
    <div>
        数量: <input type="number" ng-model="qty" required >
    </div>
    <div>
        单价: <input type="number" ng-model="cost" required >
    </div>
    <div>
        <b>总价:{{ qty * cost}}</b>
    </div>
</div>

 初始化的时候数量是1 单价是2

 

 

如果你在弄一个邮箱登录   需要验证他是不是正确邮箱格式 需要一个 ng-show

 

<span ng-show="myForm.myAddress.$error.email">不是一个合法的邮箱地址</span>

 它会根据 ng-show里的值判断你输入的是否正确

分享到:
评论

相关推荐

    AngularJS入门教程之AngularJS表达式

    AngularJS表达式格式 : {{expression }} AngularJS表达式可以是字符串、数字、运算符和变量 数字运算{{1 + 5}} 字符串连接{{ ‘abc’ + ‘bcd’ }} 变量运算 {{ firstName + ” ” + lastName }}, {{ quantity * ...

    AngularJS 表达式详细讲解及实例代码.docx

    AngularJS 表达式详细讲解及实例代码.docx

    AngularJS 表达式详细讲解及实例代码

    AngularJS 表达式 AngularJS 使用 表达式 把数据绑定到 HTML。 AngularJS 表达式写在双大括号内: {{ expression }} 。 AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙。 AngularJS 将在...

    AngularJS 表达式

    AngularJS 表达式 AngularJS 使用 表达式 把数据绑定到 HTML。 AngularJS 表达式 AngularJS 表达式写在双大括号内:{{ expression }}。 AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙。 ...

    AngularJS 表达式详解及实例代码

    主要介绍了AngularJS 表达式,这里整理了详细的资料,有需要的小伙伴可以参考下

    AngularJS表达式讲解及示例代码

    本文主要讲解AngularJS表达式,这里整理了相关资料和提供示例代码以及实现效果图,有需要的小伙伴可以参考下

    AngularJS基础学习笔记之表达式

    AngularJS表达式  AngularJS表达式写在双大括号中:{{ 表达式语句 }}。  AngularJS表达式绑定数据到HTML的方式与ng-bind指令的方式相同。  AngularJS会准确地将表达式“输出”为计算的结果。  AngularJS表达式...

    AngularJS入门教程之AngularJS模型

    AngularJS入门教程之AngularJS表达式 AngularJS入门教程之AngularJS指令 在前面表达式和指令的教程中了解到,AngularJS模型(ng-model)可以将HTML输入域中的值与AngularJS创建的变量绑定。 &lt;!DOCTYPE html&gt; &lt...

    精通AngularJS part1

    确保AngularJS表达式内HTML内容的安全性195 允许不安全的HTML绑定196 净化HTML196 防止JSON注入攻击197 防止跨站请求伪造198 74客户端安全198 创建security服务199 显示登录表单200 创建安全的菜单及工具栏...

    AngularJS 0002:表达式

    文章:http://blog.csdn.net/yysyangyangyangshan/article/details/53323137

    AngularJSEclipsePlugin.zip

    提供 HTML 编辑器支持 AngularJS 表达式和指令 提供 Angular Explorer 视图用来显示模块、控制器 提供 JavaScript 编辑器支持 AngularJS 特性 (modules, etc). Eclipse Update:...

    angularjs自定义正则表达校验指令directive

    暂时有http的校验 和 纯数字的校验,代码共享

    AngularJS解决ng界面长表达式(ui-set)的方法分析

    主要介绍了AngularJS解决ng界面长表达式(ui-set)的方法,通过具体问题的分析并结合实例形式给出了AngularJS长表达式的相关使用技巧,需要的朋友可以参考下

    angular-treeRepeat:AngularJS 的递归转发器

    它必须设置在包含其他指令的元素上frangTreeRepeat ,语法与ngRepeat frangTreeInsertChildren ,带有一个 AngularJS 表达式,计算结果为子节点的集合,用于下一级重复frangTreeRepeat节点重复使用frangTreeRepeat...

    详解AngularJS中的表达式使用

    AngularJS应用表达式是纯javascript表达式,并输出它们被使用的数据在那里。 使用数字 &lt;p&gt;Expense on Books : {{cost * quantity}} Rs 使用字符串 &lt;p&gt;Hello {{student.firstname + + student.lastname}}! 使用...

Global site tag (gtag.js) - Google Analytics