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)
BREAKING CHANGE: ion-content's has-header/footer/tabs attributes
no longer work.
Use the classes 'has-header', 'has-subheader', 'has-footer', and
'has-tabs' to modify the positioning of the ion-content relative
to surrounding elements.
Before: `<ion-content has-header="true">`
After: `<ion-content class="has-header">`
/**
* @ngdoc method
* @name $ionicScrollDelegate#rememberScrollPosition
* @description
*
* When this scroll area is destroyed, its last scroll position will be
* saved using the given id.
*
* @param {string} id The identifier for this saved scroll position.
*/
/**
* @ngdoc method
* @name $ionicScrollDelegate#scrollToRememberedPosition
* @description
*
* If a scroll position was remembered using the given id, loads the
* remembered scroll position and scrolls there.
*
* @param {string} id The identifier for this saved scroll position.
* @param {boolean=} shouldAnimate Whether to animate the scroll.
*/
BREAKING CHANGE: $ionicScrollDelegate no longer works globally; you must
create a new instance of each time you use it. The actual methods on
each instance of $ionicScrollDelegate are the same, however.
Change your code from this:
```js
function MyController($scope, $ionicScrollDelegate) {
$scope.scrollTop = function() {
$ionicScrollDelegate.scrollTop();
};
}
```
To this:
```js
function MyController($scope, $ionicScrollDelegate) {
var delegate = $ionicScrollDelegate($scope);
$scope.scrollTop = function() {
delegate.scrollTop();
};
}
```
Closes#760
BREAKING CHANGE: on-refresh and on-refresh-opening are no longer on the
ion-content directive. They are on the ion-refresher. In addition,
on-refresh-opening has been renamed to on-pulling.
Change your code from this:
```html
<ion-content on-refresh="onRefresh()"
on-refresh-opening="onRefreshOpening()">
<ion-refresher></ion-refresher>
</ion-content>
```
To this:
```html
<ion-content>
<ion-refresher on-refresh="onRefresh()"
on-pulling="onRefreshOpening()">
</ion-refresher>
</ion-content>
```
Main changes:
* Use gulpfile now (build was getting way too disorganized with custom
tasks; gulpfiles are much easier to build clean custom tasks with than
Grunt.
* View README#Development for updated commands
* Docs written for ionContent, ionHeaderBar, ionInfiniteScroll.
* Docs are pushed to ajoslin's fork of ionic-site until they reach a
* point where they can be published.
**TODO, In Order of Priority**
1. Finish writing source-documentation for all existing components
2. Add multiple versions of docs (one per release & nightly, latest
stable release docs being shown by default)
3. Add examples generation
4. Add searchbar to docs
Fixes#661.
BREAKING CHANGE: The binding for ionInfiniteScroll has changed, as well
as how you finish it.
If you had this code before:
```html
<ion-content on-infinite-scroll="doSomething"></ion-content>
```
```js
function MyCtrl($scope) {
$scope.doSomething = function(scrollDoneCallback) {
doSomething();
scrollDoneCallback();
};
}
```js
Now, your code should look like this:
```html
<ion-content on-infinite-scroll="doSomething()"></ion-content>
```
``js
function MyCtrl($scope) {
$scope.doSomething = function() {
doSomething();
$scope.$broadcast('scroll.infiniteScrollComplete');
};
}
```
Adds new '$ionicBind' service, which takes an object containing
binding definitions (similar to angular directive isolate scope
definition). Allows binding of any directive attribute & expressions
from a scope, letting us do normal attribute -> scope binding
without having to create isolate scopes.
Closes#555. Closes#669
BREAKING CHANGE: All directives are now prefixed with `ion-`.
For any directive you use, add the ionic prefix.
For example, change this HTML:
```html
<tabs>
<tab title="home" href="/tab/home">
<content>Hello!</content>
</tab>
</tabs>
```
To this HTML:
```
<ion-tabs>
<ion-tab title="home" href="/tab/home">
<ion-content>Hello!</ion-content>
</ion-tab>
</ion-tabs>
```
Fixes#521. Reordering now uses webkitTransform instead of
element.style.left. Additionally, as you drag the drag-element to the
top or bottom of the scroll-area, it will scroll it up or down as
allowed.
Refactors necessary: Common code from `<content>` and `<scroll>` moved
into js/ext/angular/controllers/ionicScrollController. Then `<content>`
and `<scroll>` expose the controller, and `<list>` can require it.
`<list>` then uses the controller (if exists) to pass the scrollView and
scrollEl to ReorderDrag, and ReorderDrag uses that to scroll.
Additionally, js/ext/angular/test/controller/ionicScrollController tests
much functionality that was untested before.
`content` directive stores scroll in view page history.
The history is passed down through $viewContentLoaded event, which is
broadcasted by navView directive when it loads a page.
