zoukankan      html  css  js  c++  java
  • ionicModal中的监听事件

    //添加监听事件
    angular.module('MyApp').directive('gotTapped', ['$ionicGesture', function($ionicGesture) { return { restrict: 'A', link: function($scope, $element, $attr) { $ionicGesture.on('tap', function(e) { console.log('I got Tapped!') }, $element); } } }])
    <div got-tapped>Tap Me!</div>
    //选择元素
    document.querySelector();

    栗子:

     <body ng-controller="MyCtrl" class="padding">
        <div class="bar bar-header bar-positive">
          <h1 class="title">{{lastEventCalled}}</h1>
        </div>
        <ion-content id="eventPlaceholder" has-bouncing="false"></ion-content>
      </body>
    angular.module('ionicApp', ['ionic'])
    
    .controller('MyCtrl', function($scope, $ionicGesture, $window, $interval) {
      $scope.lastEventCalled = 'Try to Drag the content up, down, left or rigth';
      var element = angular.element(document.querySelector('#eventPlaceholder'));
      var events = [{
        event: 'dragup',
        text: 'You dragged me UP!'
      },{
        event: 'dragdown',
        text: 'You dragged me Down!'
      },{
        event: 'dragleft',
        text: 'You dragged me Left!'
      },{
        event: 'dragright',
        text: 'You dragged me Right!'
      }];
      
      angular.forEach(events, function(obj){
        $ionicGesture.on(obj.event, function (event) {
          $scope.$apply(function () {
            $scope.lastEventCalled = obj.text;
          });
        }, element);
      });
    });

    参考:http://codepen.io/shprink/pen/txliu/?editors=101


    作者:狂流
    出处:http://www.cnblogs.com/kuangliu/
    欢迎转载,分享快乐! 如果觉得这篇文章对你有用,请抖抖小手,推荐一下!

  • 相关阅读:
    day7
    day 6
    day4
    An Experimental Comparison of Min-Cut/Max-Flow Algorithms for Energy Minimization in Vision
    参数初始化之Xavier初始化
    使用tensorboardX可视化Pytorch
    使用visdom可视化pytorch训练过程
    pytorch与torchvision版本、tensorflow与keras版本
    luarocks和hdf5安装
    docker常见问题
  • 原文地址:https://www.cnblogs.com/kuangliu/p/4119309.html
Copyright © 2011-2022 走看看