mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
Also, do manual transclusion on items that would be 'deep' directives - to fix a problem with transcluding & requiring parent elements. Closes #619
88 lines
2.9 KiB
JavaScript
88 lines
2.9 KiB
JavaScript
(function() {
|
|
'use strict';
|
|
|
|
angular.module('ionic.ui.scroll', [])
|
|
|
|
/**
|
|
* @ngdoc directive
|
|
* @name ionScroll
|
|
* @module ionic
|
|
* @controller ionicScroll as $scope.$ionicScrollController
|
|
* @restrict E
|
|
*
|
|
* @description
|
|
* Creates a scrollable container for all content inside.
|
|
*
|
|
* @param {string=} controller-bind The scope variable to bind this element's scrollView's
|
|
* {@link ionic.controller:ionicScroll ionicScroll controller} to.
|
|
* Default: $scope.$ionicScrollController.
|
|
* @param {string=} direction Which way to scroll. 'x' or 'y'. Default 'y'.
|
|
* @param {boolean=} paging Whether to scroll with paging.
|
|
* @param {expression=} on-refresh Called on pull-to-refresh, triggered by an {@link ionic.directive:ionRefresher}.
|
|
* @param {expression=} on-scroll Called whenever the user scrolls.
|
|
* @param {boolean=} scrollbar-x Whether to show the horizontal scrollbar. Default false.
|
|
* @param {boolean=} scrollbar-x Whether to show the vertical scrollbar. Default true.
|
|
*/
|
|
.directive('ionScroll', ['$parse', '$timeout', '$controller', function($parse, $timeout, $controller) {
|
|
return {
|
|
restrict: 'E',
|
|
scope: {
|
|
direction: '@',
|
|
paging: '@',
|
|
onRefresh: '&',
|
|
onScroll: '&',
|
|
scroll: '@',
|
|
scrollbarX: '@',
|
|
scrollbarY: '@',
|
|
},
|
|
controller: function() {},
|
|
compile: function(element, attr) {
|
|
element.addClass('scroll-view');
|
|
|
|
//We cannot transclude here because it breaks element.data() inheritance on compile
|
|
var innerElement = angular.element('<div class="scroll"></div>');
|
|
innerElement.append(element.contents());
|
|
element.append(innerElement);
|
|
|
|
return { pre: prelink };
|
|
function prelink($scope, $element, $attr) {
|
|
var scrollView, scrollCtrl;
|
|
|
|
if (angular.isDefined($attr.padding)) {
|
|
$scope.$watch($attr.padding, function(newVal) {
|
|
innerElement.toggleClass('padding', !!newVal);
|
|
});
|
|
}
|
|
if($scope.$eval($scope.paging) === true) {
|
|
innerElement.addClass('scroll-paging');
|
|
}
|
|
|
|
if(!$scope.direction) { $scope.direction = 'y'; }
|
|
var isPaging = $scope.$eval($scope.paging) === true;
|
|
|
|
var scrollViewOptions= {
|
|
el: $element[0],
|
|
controllerBind: $attr.controllerBind,
|
|
paging: isPaging,
|
|
scrollbarX: $scope.$eval($scope.scrollbarX) !== false,
|
|
scrollbarY: $scope.$eval($scope.scrollbarY) !== false,
|
|
scrollingX: $scope.direction.indexOf('x') >= 0,
|
|
scrollingY: $scope.direction.indexOf('y') >= 0
|
|
};
|
|
if (isPaging) {
|
|
scrollViewOptions.speedMultiplier = 0.8;
|
|
scrollViewOptions.bouncing = false;
|
|
}
|
|
|
|
scrollCtrl = $controller('$ionicScroll', {
|
|
$scope: $scope,
|
|
scrollViewOptions: scrollViewOptions
|
|
});
|
|
scrollView = $scope.$parent.scrollView = scrollCtrl.scrollView;
|
|
}
|
|
}
|
|
};
|
|
}]);
|
|
|
|
})();
|