Angular js 之一些简单的js操作

Posted 2020-08-13

1.<div ng-if()> </div> 括号里面是布尔值  如果是false那么你ng-if的那个dom就会不显示。(感觉这是angular js中最给力的一点)

  一般会在controller里面来设置ng-if(abc)括号里面值得布尔值 ，类似$scope.abc=true; 如果你想默认一个值为true ，一般用于不常见

 的一个字符然后设置ng-if(!abcd) 这样默认为true。 在实际操作中 遇到那种ng-repeat出来的值，需要判断排列或者是否显示的时候，

 这个时候ng-if()的作用就尤为明显。比如你只想让大于60分成绩的学生显示，但是页面上的显示成绩又是ng-repeat打印出来的，

 可以ng-if(item.num>=60)，成绩小于60则为flase  既不会打印出来。

2.ng-class().....

第一种情况 ng-class="{‘类选择器1‘:布尔值,‘类选择器2‘:布尔值}"（这种情况适用于大于等于三种类选择器的时候）
第二种情况 ng-class="{true: ‘类选择器1‘, false: ‘类选择器2‘}[布尔值]"（这种情况适用于两种类选择器的时候）
其他情况还没遇到过 以后还会补充。

3.利用三目运算符打印出ng-repeat想要的结果。

　　 比如大于等于60表示及格，小于60表示不及格。

　　{{item.num >=60? "及格":"不及格"}}

　　如果出现情况比较复杂的时候  可以自己封装一个过滤器

　　

　　如上所示如果data等于1的时候 返回买入;等于2的时候返回卖出

　　过滤器在页面的使用

{{div.entrust_bs|oneFilter}}

4.在关于页面向上拉加载更多和向下拉刷新的问题

（1）.向上拉加载更多，一般会在页面的content部分的最底部写如下代码 然后在controller中执行loadMore函数，当实行完一次

loadMore函数的时候  在函数内部的最底部写上

$scope.$broadcast(‘scroll.infiniteScrollComplete‘);
这样函数就会自动不执行关闭不在继续刷新

<ion-infinite-scroll  on-infinite="loadMore()" ></ion-infinite-scroll>

附加一些加载更多的一些心得 如果加载更多不想去掉以前的data可以在创建一个数组，然后是每次刷新得到新的data就把data拼接起来赋值到一个空数组里面
newdata= newdata.concat(data.data)

（2）向下拉刷新一般放在content的最上部  然后在controller中执行doRefresh函数，当不想执行的时候用

$scope.$broadcast(‘scroll.refreshComplete‘);关闭函数

<ion-refresher pulling-text="下拉刷新" on-refresh="doRefresh()"></ion-refresher>