mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2026-03-13 10:22:08 +08:00
feat(ionic): remove all delegates
BREAKING CHANGE: $ionicScrollDelegate, $ionicSlideBoxDelegate, and
$ionicSideMenuDelegate have been removed.
- $ionicScrollDelegate has been changed to $ionicScrollController.
Documentation:
[ionContent](
http://ajoslin.github.io/docs/nightly/api/directive/ionContent),
[ionScroll](
http://ajoslin.github.io/docs/nightly/api/directive/ionScroll)
Change your code from this:
```html
<ion-content ng-controller="MyCtrl">
<button ng-click="scrollBottom()">Scroll to bottom!</button>
</ion-content>
```
```js
function MyCtrl($scope, $ionicScrollDelegate) {
$scope.scrollBottom = function() {
$ionicScrollDelegate.scrollBottom();
};
}
```
To this:
```html
<!-- optional attr controller-bind, see docs -->
<ion-content ng-controller="MyCtrl">
<button ng-click="scrollBottom()">Scroll to bottom!</button>
</ion-content>
```
```js
function MyCtrl($scope) {
$scope.scrollBottom = function() {
$scope.$ionicScrollController.scrollBottom();
};
}
```
- $ionicSideMenuDelegate has been changed to
$ionicSideMenusController. Documentation:
[ionSideMenus](http://ajoslin.github.io/docs/nightly/api/directive/ionSideMenus)
Change your code from this:
```html
<ion-side-menus>
<ion-side-menu side="left">Side Menu Left</ion-side-menu>
<ion-pane ion-side-menu-content ng-controller="MyCtrl">
<button ng-click="toggleLeftMenu()">
Toggle Left Menu!
</button>
</ion-pane>
</ion-side-menus>
```
```js
function MyCtrl($scope, $ionicSideMenuDelegate) {
$scope.toggleLeftMenu = function() {
$ionicSideMenuDelegate.toggleLeft();
};
}
```
To this:
```html
<!-- optional attr controller-bind, see documentation -->
<ion-side-menus>
<ion-side-menu side="left">Side Menu Left</ion-side-menu>
<ion-pane ion-side-menu-content ng-controller="MyCtrl">
<button ng-click="toggleLeftMenu()">
Toggle Left Menu!
</button>
</ion-pane>
</ion-side-menus>
```
```js
function MyCtrl($scope) {
$scope.toggleLeftMenu = function() {
$scope.$ionicSideMenuController.toggleLeft();
};
}
```
- $ionicSlideBoxDelegate has been removed and upgraded to
$ionicSlideBoxController. It had only one method that
was unneeded. [Documentation](
http://ajoslin.github.io/docs/nightly/api/directive/ionSlideBox)
This commit is contained in:
29
js/ext/angular/src/directive/ionicBar.js
vendored
29
js/ext/angular/src/directive/ionicBar.js
vendored
@@ -3,11 +3,36 @@
|
||||
|
||||
angular.module('ionic.ui.header', ['ngAnimate', 'ngSanitize'])
|
||||
|
||||
.directive('barHeader', ['$ionicScrollDelegate', function($ionicScrollDelegate) {
|
||||
.directive('barHeader', ['$document', function($document) {
|
||||
return {
|
||||
restrict: 'C',
|
||||
link: function($scope, $element, $attr) {
|
||||
$ionicScrollDelegate($scope).tapScrollToTop($element);
|
||||
ionic.requestAnimationFrame(function() {
|
||||
var scrollCtrl = $element.controller('$ionicScroll');
|
||||
if (!scrollCtrl) {
|
||||
return;
|
||||
}
|
||||
|
||||
ionic.on('tap', onTap, $element[0]);
|
||||
$scope.$on('$destroy', function() {
|
||||
ionic.off('tap', onTap, $element[0]);
|
||||
});
|
||||
|
||||
function onTap(e) {
|
||||
if (ionic.DomUtil.getParentOrSelfWithClass(e.target, 'button', 4)) {
|
||||
return;
|
||||
}
|
||||
var touch = e.gesture && e.gesture.touches[0] || e.detail.touches[0];
|
||||
var bounds = $element[0].getBoundingClientRect();
|
||||
if(ionic.DomUtil.rectContains(
|
||||
touch.pageX, touch.pageY,
|
||||
bounds.left, bounds.top - 20,
|
||||
bounds.left + bounds.width, bounds.top + bounds.height)
|
||||
) {
|
||||
scrollCtrl.scrollTop(true);
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
}])
|
||||
|
||||
21
js/ext/angular/src/directive/ionicContent.js
vendored
21
js/ext/angular/src/directive/ionicContent.js
vendored
@@ -1,7 +1,7 @@
|
||||
(function() {
|
||||
'use strict';
|
||||
|
||||
angular.module('ionic.ui.content', ['ionic.ui.service', 'ionic.ui.scroll'])
|
||||
angular.module('ionic.ui.content', ['ionic.ui.scroll'])
|
||||
|
||||
/**
|
||||
* Panel is a simple 100% width and height, fixed panel. It's meant for content to be
|
||||
@@ -28,6 +28,8 @@ angular.module('ionic.ui.content', ['ionic.ui.service', 'ionic.ui.scroll'])
|
||||
* @ngdoc directive
|
||||
* @name ionContent
|
||||
* @module ionic
|
||||
* @controller ionicScroll as $scope.$ionicScrollController
|
||||
* @restrict E
|
||||
*
|
||||
* @description
|
||||
* The ionContent directive provides an easy to use content area that can be configured
|
||||
@@ -45,6 +47,9 @@ angular.module('ionic.ui.content', ['ionic.ui.service', 'ionic.ui.scroll'])
|
||||
* Use the classes 'has-header', 'has-subheader', 'has-footer', and 'has-tabs'
|
||||
* to modify the positioning of the ion-content relative to surrounding elements.
|
||||
*
|
||||
* @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 {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.
|
||||
@@ -67,6 +72,7 @@ function($parse, $timeout, $controller, $ionicBind) {
|
||||
transclude: true,
|
||||
require: '^?ionNavView',
|
||||
scope: true,
|
||||
priority: 501,
|
||||
template:
|
||||
'<div class="scroll-content">' +
|
||||
'<div class="scroll"></div>' +
|
||||
@@ -97,9 +103,11 @@ function($parse, $timeout, $controller, $ionicBind) {
|
||||
scrollEventInterval: '@'
|
||||
});
|
||||
|
||||
$scope.$watch($attr.padding, function(newVal) {
|
||||
scrollContent.toggleClass('padding', !!newVal);
|
||||
});
|
||||
if (angular.isDefined($attr.padding)) {
|
||||
$scope.$watch($attr.padding, function(newVal) {
|
||||
scrollContent.toggleClass('padding', !!newVal);
|
||||
});
|
||||
}
|
||||
|
||||
if ($scope.scroll === "false") {
|
||||
//do nothing
|
||||
@@ -111,6 +119,7 @@ function($parse, $timeout, $controller, $ionicBind) {
|
||||
$scope: $scope,
|
||||
scrollViewOptions: {
|
||||
el: $element[0],
|
||||
controllerBind: $attr.controllerBind,
|
||||
bouncing: $scope.$eval($scope.hasBouncing),
|
||||
startX: $scope.$eval($scope.startX) || 0,
|
||||
startY: $scope.$eval($scope.startY) || 0,
|
||||
@@ -128,7 +137,7 @@ function($parse, $timeout, $controller, $ionicBind) {
|
||||
}
|
||||
});
|
||||
//Publish scrollView to parent so children can access it
|
||||
scrollView = $scope.$parent.scrollView = scrollCtrl.scrollView;
|
||||
scrollView = scrollCtrl.scrollView;
|
||||
}
|
||||
|
||||
transclude($scope, function(clone) {
|
||||
@@ -227,7 +236,7 @@ function($parse, $timeout, $controller, $ionicBind) {
|
||||
$onPulling: '&onPulling'
|
||||
});
|
||||
|
||||
scrollCtrl.setRefresher($scope, $element[0]);
|
||||
scrollCtrl._setRefresher($scope, $element[0]);
|
||||
$scope.$on('scroll.refreshComplete', function() {
|
||||
$element[0].classList.remove('active');
|
||||
scrollCtrl.scrollView.finishPullToRefresh();
|
||||
|
||||
5
js/ext/angular/src/directive/ionicScroll.js
vendored
5
js/ext/angular/src/directive/ionicScroll.js
vendored
@@ -7,11 +7,15 @@ 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}.
|
||||
@@ -61,6 +65,7 @@ angular.module('ionic.ui.scroll', [])
|
||||
|
||||
var scrollViewOptions= {
|
||||
el: $element[0],
|
||||
controllerBind: $attr.controllerBind,
|
||||
paging: isPaging,
|
||||
scrollbarX: $scope.$eval($scope.scrollbarX) !== false,
|
||||
scrollbarY: $scope.$eval($scope.scrollbarY) !== false,
|
||||
|
||||
@@ -94,7 +94,7 @@ angular.module('ionic.ui.sideMenu', ['ionic.service.gesture', 'ionic.service.vie
|
||||
* ```js
|
||||
* function ContentController($scope) {
|
||||
* $scope.toggleLeft = function() {
|
||||
* $scope.sideMenuController.toggleLeft();
|
||||
* $scope.$ionicSideMenusController.toggleLeft();
|
||||
* };
|
||||
* }
|
||||
* ```
|
||||
|
||||
3
js/ext/angular/src/directive/ionicTabBar.js
vendored
3
js/ext/angular/src/directive/ionicTabBar.js
vendored
@@ -270,6 +270,9 @@ function($rootScope, $animate, $ionicBind, $compile, $ionicViewService) {
|
||||
tabsCtrl = ctrls[0],
|
||||
tabCtrl = ctrls[1];
|
||||
|
||||
//Remove title attribute so browser-tooltip does not apear
|
||||
$element[0].removeAttribute('title');
|
||||
|
||||
$ionicBind($scope, $attr, {
|
||||
animate: '=',
|
||||
onSelect: '&',
|
||||
|
||||
Reference in New Issue
Block a user