Skip to content

Commit

Permalink
refactor(ionList): more expressive, declarative (breaking change)
Browse files Browse the repository at this point in the history
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>
```
  • Loading branch information
ajoslin committed Apr 4, 2014
1 parent ad12bff commit 986dbac
Show file tree
Hide file tree
Showing 11 changed files with 784 additions and 675 deletions.
23 changes: 23 additions & 0 deletions docs/templates/api_menu_version.template.html
Expand Up @@ -220,6 +220,29 @@
</a>
</li>

<li>
<a href="{{ page.versionHref }}/api/directive/ionDeleteButton/">
ion-delete-button
</a>
</li>

<li>
<a href="{{ page.versionHref }}/api/directive/ionReorderButton/">
ion-reorder-button
</a>
</li>

<li>
<a href="{{ page.versionHref }}/api/directive/ionOptionButton/">
ion-option-button
</a>
</li>

<li>
<a href="{{ page.versionHref }}/api/service/$ionicListDelegate/">
$ionicListDelegate
</a>
</li>
</ul>
</li>

Expand Down
2 changes: 1 addition & 1 deletion js/ext/angular/src/controller/ionicScrollController.js
Expand Up @@ -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>
Expand Down

0 comments on commit 986dbac

Please sign in to comment.