我们没学一门语言或者框架，几乎里面都有各自的语法和内置函数，当然，强悍的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开发-修改AVD路径

    最近清理系统的时候发现C盘下有个.android文件夹占了大概10G的空间,这可怎么办,后来证实是AVD的缘故,只能修改AVD路径了. 以下是修改AVD路径的方法: 1.创建新的环境变量,ANDROI ...

  2. Naming Conventions for .NET / C# Projects

    http://www.akadia.com/services/naming_conventions.html Naming Conventions for .NET / C# Projects Mar ...

  3. Effective Project Communications

    I was recently invited to speak at a conference in Singapore on Effective Project Communications. I' ...

  4. hexo 搭建博客

    使用hexo搭建网站.记录一下. hexo搭建方法: https://wsgzao.github.io/post/hexo-guide/ http://jacob110.github.io/2015/ ...

  5. 移动端a链接点击时取出背景色及边框

    a{blr:expression(this.onFocus=this.blur())} :focus{outline:0;} /*去掉a标签的虚线框,避免出现奇怪的选中区域*/*{-webkit-ta ...

  6. glOrtho、glFrustum && glPerspective

    glOrtho         :正交投影,摄像机可以位于裁剪体内,所以near和far可以取两个正值或者一正一负 glFrustum     :透视投影,摄像机不可以位于裁剪体内,所以near和fa ...

  7. ava获得当前文件路径

    第一种: File f = new File(this.getClass().getResource("/").getPath()); System.out.println(f); ...

  8. 还原SQLServer2008数据库报用户无法登录 .

    在一台新的服务器上还原mssql2008r2数据库后,原来数据库中的账户无法用来打开这台新还原的数据库,报错:登录失败 错误代码:4064. 分析原因:在备份数据库的时候,服务器引擎中的安全-> ...

  9. Android开源项目SlidingMenu深入剖析

    SlidingMenu简介: SlidingMenu的是一种比较新的设置界面或配置界面效果,在主界面左滑或者右滑出现设置界面,能方便的进行各种操作.目前有大量的应用都在使用这一效果.如Evernote ...

  10. 【转载】：【C++跨平台系列】解决STL的max()与numeric_limits::max()和VC6 min/max 宏冲突问题

    http://www.cnblogs.com/cvbnm/articles/1947743.html 多年以前,Microsoft 幹了一件比 #define N 3 還要蠢的蠢事,那就是在 < ...