angular 移動端開發,啓用ngTouchstart,ngTouchmove,ngTouchendapp
1.自定義指令code
.directive("ngTouchstart", function () { return { controller: ["$scope", "$element", function ($scope, $element) { $element.bind("touchstart", onTouchStart); function onTouchStart(event) { var method = $element.attr("ng-touchstart"); $scope.$apply(method); } }] } }) .directive("ngTouchmove", function () { return { controller: ["$scope", "$element", function ($scope, $element) { $element.bind("touchstart", onTouchStart); function onTouchStart(event) { event.preventDefault(); $element.bind("touchmove", onTouchMove); $element.bind("touchend", onTouchEnd); } function onTouchMove(event) { var method = $element.attr("ng-touchmove"); $scope.$apply(method); } function onTouchEnd(event) { event.preventDefault(); $element.unbind("touchmove", onTouchMove); $element.unbind("touchend", onTouchEnd); } }] } }) .directive("ngTouchend", function () { return { controller: ["$scope", "$element", function ($scope, $element) { $element.bind("touchend", onTouchEnd); function onTouchEnd(event) { var method \= $element.attr("ng-touchend"); $scope.$apply(method); } }] } })
2.HTML頁面上調用element
<div ng-touchstart="startTouch()" ng-touchend="endTouch()">
3.在controller,js 中寫startTouch,endTouch的方法邏輯開發