zoukankan      html  css  js  c++  java
  • AngularJs之五

    一: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 服务。
    创建自定义服务。

  • 相关阅读:
    IDEA安装步骤
    记录常用网站
    IDEA解决中文乱码问题
    使用IDEA 中 实现springboot 热部署 (spring boot devtools版)
    Springboot学习
    写文档步骤
    some untracked working tree files问题解决
    利用mybatis-generator自动生成代码
    Java实现打印功能
    sql语句大全
  • 原文地址:https://www.cnblogs.com/liulijun330/p/6238467.html
Copyright © 2011-2022 走看看