AngualrJS是 JavaScript框架。

<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>

AngularJS扩展了html

AngularJS通过ng-directives扩展了html:比如:

ng-app指令定义了一个angular的应用程序。

ng-model指令把元素值绑定到应用程序。

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

什么是 AngularJS?

AngularJS 使得开发现代的单页面应用程序(SPAs:Single Page Applications)变得更加容易。

  • AngularJS 把应用程序数据绑定到 HTML 元素。
  • AngularJS 可以克隆和重复 HTML 元素。
  • AngularJS 可以隐藏和显示 HTML 元素。
  • AngularJS 可以在 HTML 元素"背后"添加代码。
  • AngularJS 支持输入验证。

AngularJS 表达式

  AngularJS 表达式写在双大括号内:{{ expression }}。

  AngularJS 表达式把数据绑定到 HTML,这与 ng-bind 指令有异曲同工之妙。或用{{}}或用ng-bind

  AngularJS 表达式 很像 JavaScript 表达式:它们可以包含文字、运算符和变量。实例 {{ 5 + 5 }} 或 {{ firstName + " " + lastName }}

  <div ng-init="x=1;y=5">
            <p>总价:{{x*y}}</p>    
            <p ng-bind="x*y"></p>
      </div>

  带有对象的表达式、带有数组的表达式……

  <div ng-init="person={name:'li',age:'18'}">
            {{person.age}}
        </div>

AngularJS 过滤器

  currency 格式化数字为货币格式。

  filter 从数组项中选择一个子集。

  lowercase 格式化字符串为小写。

  orderBy 根据某个表达式排列数组。

  uppercase  格式化字符串为大写。

AngularJS 菜鸟的更多相关文章

  1. [学习笔记] 七步从AngularJS菜鸟到专家(7):Routing [转]

    这是"AngularJS – 七步从菜鸟到专家"系列的第七篇. 在第一篇,我们展示了如何开始搭建一个AngularaJS应用.在第四.五篇我们讨论了Angular内建的directives,上一篇了解 ...

  2. [学习笔记] 七步从AngularJS菜鸟到专家(6):服务 [转]

    这是"AngularJS – 七步从菜鸟到专家"系列的第六篇. 在第一篇,我们展示了如何开始搭建一个AngularaJS应用.在第五篇我们讨论了Angular内建的directives.在这一章,我们 ...

  3. [学习笔记] 七步从AngularJS菜鸟到专家(4和5):指令和表达式 [转]

    这一篇包含了"AngularJS - 七步从菜鸟到专家"系列的第四篇(指令)和第五篇(表达式). 之前的几篇展示了我们应用的核心组件,以及如何设置搭建一个Angular.js应用.在这一部分,我们会厘 ...

  4. 七步从AngularJS菜鸟到专家(7):Routing

    这是"AngularJS – 七步从菜鸟到专家"系列的第七篇. 在第一篇,我们展示了如何開始搭建一个AngularaJS应用.在第四.五篇我们讨论了Angular内建的directives.上一篇了解 ...

  5. angularjs 菜鸟教程 版本1.4.6

    最简angularJS webstorm代码提示 在 head 里面添加:<script src="https://ajax.googleapis.com/ajax/libs/angu ...

  6. AngularJS的学习--TodoMVC的分析

    最近一段时间一直在看AngularJS,趁着一点时间总结一下. 官网地址:http://angularjs.org/ 先推荐几个教程 1. AngularJS入门教程 比较基础,是官方Tutorial ...

  7. 看AngularJS

    最近一段时间一直在看AngularJS,趁着一点时间总结一下. 官网地址:http://angularjs.org/ 先推荐几个教程 1. AngularJS入门教程 比较基础,是官方Tutorial ...

  8. AngularJS指令封装高德地图组件

    1 概述 公司移动门户原来是基于AngularJS指令封装的百度地图组件,用于签到.签退.定位等功能,在使用过程中发现百度地图频繁的弹出广告,所以打算重新引用其它地图组件,最后决定基于AngularJ ...

  9. AngularJs 常用

    Angularjs开发一些经验总结:http://www.cnblogs.com/whitewolf/archive/2013/03/24/2979344.html 七步从AngularJS菜鸟到专家 ...

随机推荐

  1. CNCF LandScape Summary

    CNCF Cloud Native Interactive Landscape 1. App Definition and Development 1. Database Vitess:itess i ...

  2. LeetCode 987. Vertical Order Traversal of a Binary Tree

    原题链接在这里:https://leetcode.com/problems/vertical-order-traversal-of-a-binary-tree/ 题目: Given a binary ...

  3. 删除github中某个文件夹

    在上传项目到github时,忘记忽略了某个文件夹target,就直接push上去了, 最后意识到了此问题,决定删除掉远程仓库中的target文件夹 删除前: 删除后: 在github上只能删除仓库,却 ...

  4. 网络协议 7 - UDP 协议

    网络协议五步登天路,我们一路迈过了物理层.链路层,今天终于到了传输层.从这一层开始,很多知识应该都是服务端开发必备的知识了,今天我们就一起来梳理下.     其实,讲到 UDP,就少不了 TCP.这俩 ...

  5. STRING Cytoscape 网络互作图

    网络图(Network)看似复杂,其实构成非常简单,网络图是一种图解模型,形状如同网络,故称网络图,由节点(node)和连线(edge)两个因素组成的.其中 node 又分为 source node( ...

  6. 创维(Skyworth)电视 & 小米盒子3增强版

    创维(Skyworth)电视 型号:43G7200(8H87) 品类:GLED Air TV OS:酷开64位6.20.80601-806061  兼容Android L CPU:四核 Cortex ...

  7. linux运维 技能树

    linux运维 技能树:: 初级运维: 基础:mysql基础,网络基础,计算机基础,linux系统vim, nginx ,grep ,awk,sed ,zaabix和常用开源软件,java tomca ...

  8. leetcode-19:给定一个链表,删除链表的倒数第 n 个节点,并且返回链表的头结点。

    /** * Definition for singly-linked list. * public class ListNode { * int val; * ListNode next; * Lis ...

  9. django orm 外键id返回对应的名称

    原文:https://blog.csdn.net/gghhm/article/details/99652143 当我们在写django的orm模块时,有时候会在用外键关联时,保存的是对应表中的id字段 ...

  10. 使用软件FileZilla, 通过sftp协议实现windows与linux系统传输文件

    前提: windows 7 /windows8 / windows 10系统已安装FileZilla软件: 我们还有一个Linux系统,系统上安装了ssh服务,并且开放了22端口. 操作: 1.打开软 ...