码迷,mamicode.com
首页 > Web开发 > 详细

angularJS(6)

时间:2017-01-07 20:51:16      阅读:166      评论:0      收藏:0      [点我收藏+]

标签:hang   title   mct   pos   img   location   点击事件   移动   过滤   

angularJS(6)

一:angularJs的事件。

1.ng-click指令定义了AngularJS点击事件。

技术分享
技术分享
<div ng-app="myapp" ng-controller="myctrl">
    <button ng-click="count=count+1">点赞</button>
    <h1><span  style="color:‘red">?</span>{{count}}</h1>
</div>
<script type="text/javascript">
        angular.module(‘myapp‘,[]).controller(‘myctrl‘,function ($scope) {
            $scope.count=0;
        })
</script>
技术分享
技术分享

2.angularJs的事件方法

技术分享
技术分享
<div ng-app="mapp" ng-controller="mctrl">
  <input type="button" ng-click="toggle()" value="显示/隐藏">
  <div ng-show="hhh">
      你的大名:<input type="text" ng-model="uname"><br>
    你的称呼:<input type="text" ng-model="usex"><br>
    <h1>{{uname+usex}}</h1>
  </div>
</div>
<script language="javascript">
 var app=angular.module("mapp",[]);
 app.controller("mctrl",function($scope){
      $scope.uname=“黄袍怪";
      $scope.usex="妖";
      $scope.hhh=true;
      $scope.toggle=function(){
          $scope.hhh= !$scope.hhh;
          }
     })
</script>
技术分享
技术分享

二:下面列一些angularJs常用的事件。

·ng-mousedown 鼠标按下
·ng-mouseup鼠标按下弹起
·ng-mouseenter鼠标进入
·ng-mouseleave鼠标离开
·ng-mousemove鼠标移动
·ng-mouseover鼠标进入

·ng-dblclick双击事件
·ng-blur 失去焦点事件
·ng-focus获取焦点
·ng-change更新model
·ng-copy 复制 ctrl+c
·ng-paste 粘贴 ctrl+v
·ng-keydown:键盘按下

 三:angularJs过滤器。

AngularJS 过滤器可用于转换数据:
格式化数字为货币格式:currency
从数组项中选择一个子集:filter
格式化字符串为小写: lowercase
根据某个表达式排列数组:orderBy:’列名’
默认是从小到大排序,如果想从大到小排序,只需在列名前加 – 号
 显示前几条: limitTo:3
如:<li ng-repeat=“x in student | orderBy:’uage’ | limitTo:3”>{{x.sname}}</li>
格式化字符串为大写:uppercase

实例:{{ uname | uppercase }}

四:angularJs服务(service)

AngularJS 中,服务是一个函数或对象,可在你的 AngularJS 应用中使用。AngularJS 内建了30 多个服务

$location  服务 。 
$http 服务。
$timeout 服务。
$interval 服务。
创建自定义服务。

好文要顶 已关注 收藏该文 技术分享 技术分享

angularJS(6)

标签:hang   title   mct   pos   img   location   点击事件   移动   过滤   

原文地址:http://www.cnblogs.com/gh0408/p/6260141.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!