我们没学一门语言或者框架，几乎里面都有各自的语法和内置函数，当然，强悍的angularjs也不例外，他的方法其实常用的没多少，因为很多都可以用源生jis几乎都能完成一大部分。。

<!doctype html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <link rel="stylesheet" href="css/amazeui.min.css">

    <script src="js/jq2.js"></script>

    <script src="js/amazeui.min.js"></script>

    <script src="js/angular.min.js"></script>

    <style>

        .TextBlod { font-weight:bold; }

        .Red { color:red;  }

        .Blue { color:blue; }

        .Bgred{ background:#dd514c; color:green; }

        .Bgblue{ background:#23ccfe; color:green; }

        .Oncss{ background:#000000; color:#ffffff; }

    </style>

</head>

<body ng-app="myapp">

<script type="text/ng-template" id="newlists">

    <ul class="am-avg-sm-8" ng-repeat="c in data | orderBy:'name'" ng-class-odd="Bgred" ng-class-even="Bgblue"

        ng-click="liClick($index)" ng-class="{true:'Oncss'}[$index == index]"

    >

        <li>{{$index}}</li>

        <li>{{c.name}}</li>

        <li ng-class="{true:'Red'}[c.age > 40]">{{c.age}}</li>

        <li>{{c.sex}}</li>

        <li ng-class="{true:'Red',false:'Blue'}[c.dang == 1]">{{c.dang ==  "1"? "是":"否"}}</li>

        <li>{{$first ? "是":"否"}}</li>

        <li>{{$last ? "是":"否"}}</li>

        <li ng-class="{true:'Red',false:'Blue'}[c.dang == 1]">{{$middle ? "是":"否"}}</li>

    </ul>

</script>

{{'3.1415926' | number:'2'}} --------number格式化数字

<br />

{{'Hello World' | lowercase}}--------lowercase小写

<br />

{{'Hello World' | uppercase}}--------uppercase大写

<br />

{{'Hello World' | limitTo:'2'}}-------limitTo限制数组长度或者字符串长度

<br />

filter匹配子串,有点像mysql里面的

<br />

{{}}------------data解析时间戳来进行解析成我们看得懂的时间格式  用法：  otime(这里创建出来的时间戳) |  date："yyyy-MM-dd hh:mm:ss"

<br />

json（格式化json对象）

<br />

{{ '33.53'| currency:'￥'}}--------currency货币处理

<ul class="am-avg-sm-8" ng-class="TextBlod" ng-controller="news">

  {{ data | filter:"ali"}}

    <li>序号</li>

    <li>姓名</li>

    <li>年龄</li>

    <li>性别</li>

    <li>党员</li>

    <li>是否是首条</li>

    <li>是否是尾条</li>

    <li>不属于前尾</li>

</ul>

<ul class="am-avg-sm-8" ng-include src="'newlists'" ng-controller="news">

</ul>

</body>

<script>

    var app = angular.module('myapp',[]);

    app.controller('news',function($scope){

        $scope.TextBlod = 'TextBlod';

        $scope.Red = 'Red';

        $scope.Blue = 'Blue';

        $scope.Bgred = 'Bgred';

        $scope.Bgblue = 'Bgblue';

        $scope.Oncss = 'Oncss';

        $scope.data = [

            {name:"baidu",age:"11",sex:"男",dang:"1"},

            {name:"ali",age:"22",sex:"女",dang:"1"},

            {name:"tengxun",age:"33",sex:"男",dang:"0"},

            {name:"wangyi",age:"44",sex:"女",dang:"0"},

            {name:"xinlang",age:"55",sex:"男",dang:"1"},

            {name:"google",age:"66",sex:"男",dang:"0"},

            {name:"weiruan",age:"77",sex:"女",dang:"1"},

            {name:"lieping",age:"33",sex:"男",dang:"0"}

        ];

        $scope.liClick = function(index){

            $scope.index = index;

        }

    });

</script>

</html>

夺命雷公狗—angularjs—10—angularjs里面的内置函数的更多相关文章

  1. 10、SQL Server 内置函数、临时对象、流程控制

    SQL Server 内置函数 日期时间函数 --返回当前系统日期时间 select getdate() as [datetime],sysdatetime() as [datetime2] getd ...

  2. python之路（10）类的内置函数

    目录 isinstance()和issubclass() __setitem__.__getitem__和__delitem__ __str__和__reper__ __format__ __slot ...

  3. 夺命雷公狗—angularjs—6—单条数据的遍历

    我们在实际的工作中常常会处理到一些数据的遍历,这些数据都是后端传到前端的,有些公司会让前端帮忙处理一点遍历的工作,废话不多说,直接上代: <!doctype html> <html ...

  4. 夺命雷公狗-----React---12--添加类和样式

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  5. 夺命雷公狗---微信开发59----在线点播电影网1之ckplayer播放器

    我们节课程就要开始写一个小项目了,这项目主要是写一个在线点播电影影网的,我们用到的播放器是ckplayer ckplayer基本介绍: ckplayer的全称是:超酷flv播放器,他是一款用于网页上播 ...

  6. 夺命雷公狗-----React---11--添加css样式的方法

    <!DOCTYPE> <html> <head> <meta charset="utf-8"> <title></ ...

  7. 夺命雷公狗-----React---10--组建嵌套进行数据遍历

    先写一个组建... 然后进行嵌套.. <!DOCTYPE html> <html lang="en"> <head> <meta char ...

  8. 夺命雷公狗-----React---9--map数据的遍历

    比如我们要实现的是这种效果: 用这种方法来写,她只能写死在哪,没啥意思,所以我们定义一个数据,然后来测试下map方法对她遍历出来的数据 <!DOCTYPE html> <html l ...

  9. 夺命雷公狗-----React---8--react官方提供的组建实现双向绑定

    首先要引入她.. <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...

随机推荐

  1. 【Android测试】【随笔】模拟长按电源键

    ◆版权声明:本文出自胖喵~的博客,转载必须注明出处. 转载请注明出处:http://www.cnblogs.com/by-dream/p/5195121.html 起因 昨天群里看到有人问如何实现一个 ...

  2. jade复用

    jade复用说白了就是模板的继承. 使用 block 标识符,设置一个可修改的代码片段 layout.jade doctype html html head block title title Def ...

  3. mongoDB安装学习

    一: 下载安装 上MongoDB官网 ,下载之后安装 安装好了之后在对应的安装目录下就会看到安装的文件 二:启动 微软徽标+R,输入cmd,首先找到“mongodb”的路径,然后运行mongod开启命 ...

  4. http://blog.csdn.net/rongyongfeikai2/article/details/41659353

    http://blog.csdn.net/rongyongfeikai2/article/details/41659353

  5. BI系统规划前需要准备的6项工作

    通常在进行商业智能信息系统项目之前,可以先从明确经营分析的愿景和目的入手,确定分析方法和工具.设计经营分析框架.设计指标和报表.IT实现和持续改进机制建立等几个步骤,即先有经营分析体系再有商业智能.第 ...

  6. Java程序员面试失败的5大原因

    下面是Java程序员面试失败最有可能的5大原因,当然也许这5点原因适用于所有的程序员,所以,如果你是程序员,请认真阅读以下内容. #1 说得太少 尤其是那些开放式的问题,如“请介绍下你自己”或“请讲一 ...

  7. Java Volatile关键字

    在当前的Java内存模型下,线程可以把变量保存在本地内存(比如机器的寄存器)中,而不是直接在主存中进行读写. 这就可能造成一个线程在主存中修改了一个变量的值,而另外一个线程还继续使用它在寄存器中的变量 ...

  8. IntelliJ IDEA 的 Jetty部署插件

    jetty相对于tomcat来说,启动速度非常快,方便调试. 在idea的maven项目中,只需要在pom.xml配置文件中配置jetty的插件即可. 全部: <project xmlns=&q ...

  9. 第五篇 SQL Server安全架构和安全

    本篇文章是SQL Server安全系列的第五篇,详细内容请参考原文. 架构本质上是一个数据库对象,其他对象的一个容器,在复杂的数据库中它能够很容易的管理各组对象.架构具有重要的安全功能.在这一篇你会学 ...

  10. 微信的公众号unionid

    此外,由于开发者经常有需在多个平台(移动应用.网站.公众帐号)之间共通用户帐号,统一帐号体系的需求,微信开放平台(open.weixin.qq.com)提供了UnionID机制.开发者可通过OpenI ...