refactor(ionList): more expressive, declarative (breaking change)

Closes #1024.

BREAKING CHANGE: ion-list syntax has changed in favor of simplicity &
flexibility.

Relevant documentation:
[ionList](http://ionicframework.com/docs/api/directive/ionList),
[ionItem](http://ionicframework.com/docs/api/directive/ionItem),
[ionOptionButton](http://ionicframework.com/docs/api/directive/ionOptionButton),
[ionReorderButton](http://ionicframework.com/docs/api/directive/ionReorderButton),
[ionDeleteButton](http://ionicframework.com/docs/api/directive/ionDeleteButton),
[$ionicListDelegate](http://ionicframework.com/docs/api/service/$ionicListDelegate).

To migrate, change your code from this:

```html
<ion-list option-buttons="[{text:'hello',type:'button-positive',onTap:tap()}]"
          on-delete="onDelete(el)"
          delete-icon="ion-minus-circled"
          can-delete="true"
          show-delete="shouldShowDelete"
          on-reorder="onReorder(el, startIndex, toIndex)"
          reorder-icon="ion-navicon"
          can-reorder="true"
          show-reorder="shouldShowReorder">
  <ion-item ng-repeat="item in items">
    {{item}}
  </ion-item>
</ion-list>
```

To this:

```html
<ion-list show-delete="shouldShowDelete"
          show-reorder="shouldShowReorder">
  <ion-item ng-repeat="item in items">
    {{item}}
    <ion-delete-button class="ion-minus-circled"
                       ng-click="onDelete(item)">
    </ion-delete-button>
    <ion-reorder-button class="ion-navicon"
                       ng-click="onReorder(item, $fromIndex, $toIndex)">
    </ion-reorder-button>
    <ion-option-button class="button-positive" ng-click="tap()">
      Hello
    </ion-option-button>
  </ion-item>
</ion-list>
```
This commit is contained in:
Andy Joslin
2014-04-02 15:16:38 -06:00
parent ad12bffca7
commit 986dbac893
11 changed files with 804 additions and 695 deletions

View File

@@ -126,7 +126,7 @@ angular.module('ionic.ui.scroll')
* <ion-scroll delegate-handle="myScroll" ng-if="shouldShowScrollView">
* <div ng-controller="ScrollCtrl">
* <ion-list>
* <ion-item ng-repeat="i in items">{{i}}</ion-item>
* {% raw %}<ion-item ng-repeat="i in items">{{i}}</ion-item>{% endraw %}
* </ion-list>
* </div>
* </ion-scroll>