javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2026-03-13 10:22:08 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ionContent): don't wrap in a .scroll element if scroll="false"

Browse Source 
Fixes #841. Closes #897.
This commit is contained in:
Jay Proulx
2014-03-25 14:35:01 -04:00
committed by Andy Joslin
parent cf92d6c21c
commit 73da93d4a4
2 changed files with 43 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
js/ext/angular/src/directive/ionicContent.js vendored
View File

@@ -48,7 +48,7 @@ angular.module('ionic.ui.content', ['ionic.ui.scroll'])
* with {@link ionic.service:$ionicScrollDelegate}.
* @param {boolean=} padding Whether to add padding to the content.
* of the content. Defaults to true on iOS, false on Android.
* @param {boolean=} scroll Whether to allow scrolling of content. Defaults to true.
* @param {boolean=} scroll Whether to allow scrolling of content. Defaults to true. Note: scroll="false" removes the .scroll child element on element compilation, not on scope change
* @param {boolean=} overflow-scroll Whether to use overflow-scrolling instead of
* Ionic scroll.
* @param {boolean=} has-bouncing Whether to allow scrolling to bounce past the edges
@@ -66,12 +66,17 @@ function($timeout, $controller, $ionicBind) {
require: '^?ionNavView',
scope: true,
compile: function(element, attr) {
var innerElement;
element.addClass('scroll-content');
//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);
if (attr.scroll != 'false') {
//We cannot use normal transclude here because it breaks element.data()
//inheritance on compile
innerElement = angular.element('<div class="scroll"></div>');
innerElement.append(element.contents());
element.append(innerElement);
}
return { pre: prelink };
function prelink($scope, $element, $attr, navViewCtrl) {
@@ -104,7 +109,7 @@ function($timeout, $controller, $ionicBind) {
if (angular.isDefined($attr.padding)) {
$scope.$watch($attr.padding, function(newVal) {
innerElement.toggleClass('padding', !!newVal);
(innerElement || $element).toggleClass('padding', !!newVal);
});
}

37
js/ext/angular/test/directive/ionicContent.unit.js
View File

@@ -60,14 +60,41 @@ describe('Ionic Content directive', function() {
});
});
it('should add padding classname', function() {
it('should have no scroll element when scroll="false"', function() {
var element = compile('<ion-content scroll="false"></ion-content>')(scope);
var scroll = element.find('.scroll');
expect(scroll.length).toBe(0);
});
it('should add padding classname to scroll element', function() {
var element = compile('<ion-content padding="shouldPad"></ion-content>')(scope);
var scrollElement = element.find('.scroll');
expect(scrollElement.hasClass('padding')).toEqual(false);
var scroll = element.find('.scroll');
// by default, ion-content should have a scroll element, and the scroll element should not be padded
expect(scroll.hasClass('padding')).toEqual(false);
expect(element.hasClass('padding')).toEqual(false);
element.scope().$apply('shouldPad = true');
expect(scrollElement.hasClass('padding')).toEqual(true);
expect(scroll.hasClass('padding')).toEqual(true);
expect(element.hasClass('padding')).toEqual(false);
element.scope().$apply('shouldPad = false');
expect(scrollElement.hasClass('padding')).toEqual(false);
expect(scroll.hasClass('padding')).toEqual(false);
expect(element.hasClass('padding')).toEqual(false);
});
// keep scroll=false && padding tests separate as we don't handle a recompile yet when scroll changes.
it('should add padding classname to scroll-content element', function() {
var element = compile('<ion-content padding="shouldPad" scroll="false"></ion-content>')(scope);
// when ion-content is not scrollable, there will be no scroll element, the padding should be added to ion-content itself.
element.scope().$apply('shouldPad = false');
expect(element.hasClass('padding')).toEqual(false);
element.scope().$apply('shouldPad = true');
expect(element.hasClass('padding')).toEqual(true);
});
it('Should set start x and y', function() {