From 7e6d73b9f8575db27367aa615c43254f702a2649 Mon Sep 17 00:00:00 2001
From: Sergii Stotskyi <sergiy.stotskiy@gmail.com>
Date: Sat, 22 Oct 2016 19:00:48 +0300
Subject: [PATCH] feat(reorder): add `applyTo` method to `ionItemReorder` event

This allows to apply reordering inside template without importing any other helper functions
---
 src/components/item/item-reorder.ts        | 22 ++++++++++++++++------
 src/components/item/test/reorder/main.html |  2 +-
 2 files changed, 17 insertions(+), 7 deletions(-)

diff --git a/src/components/item/item-reorder.ts b/src/components/item/item-reorder.ts
index 50f7e38629..fd7b765385 100644
--- a/src/components/item/item-reorder.ts
+++ b/src/components/item/item-reorder.ts
@@ -4,12 +4,13 @@ import { Content } from '../content/content';
 import { CSS, zoneRafFrames } from '../../util/dom';
 import { Item } from './item';
 import { ItemReorderGesture } from '../item/item-reorder-gesture';
-import { isTrueProperty } from '../../util/util';
+import { isTrueProperty, reorderArray } from '../../util/util';
 
 
 export interface ReorderIndexes {
   from: number;
   to: number;
+  applyTo: Function;
 }
 
 /**
@@ -118,6 +119,16 @@ export interface ReorderIndexes {
  *   }
  * }
  * ```
+ * Alternatevely you can execute helper function inside template:
+ *
+ * ```html
+ * <ion-list>
+ *   <ion-list-header>Header</ion-list-header>
+ *   <ion-item-group reorder="true" (ionItemReorder)="$event.applyTo(items)">
+ *     <ion-item *ngFor="let item of items">{% raw %}{{ item }}{% endraw %}</ion-item>
+ *   </ion-item-group>
+ * </ion-list>
+ * ```
  *
  * @demo /docs/v2/demos/src/item-reorder/
  * @see {@link /docs/v2/components#lists List Component Docs}
@@ -223,10 +234,10 @@ export class ItemReorder {
     this.reorderReset();
     if (fromIndex !== toIndex) {
       this._zone.run(() => {
-        this.ionItemReorder.emit({
-          from: fromIndex,
-          to: toIndex,
-        });
+        const indexes = { from: fromIndex, to: toIndex };
+        this.ionItemReorder.emit(Object.assign({
+          applyTo: (array) => reorderArray(array, indexes)
+        }, indexes));
       });
     }
   }
@@ -368,4 +379,3 @@ export function indexForItem(element: any): number {
 export function reorderListForItem(element: any): any {
   return element['$ionReorderList'];
 }
-
diff --git a/src/components/item/test/reorder/main.html b/src/components/item/test/reorder/main.html
index 0148f37c7a..605da572db 100644
--- a/src/components/item/test/reorder/main.html
+++ b/src/components/item/test/reorder/main.html
@@ -19,7 +19,7 @@
     </button>
   </ion-list>
 
-  <ion-list [reorder]="isReordering" (ionItemReorder)="reorder($event)">
+  <ion-list [reorder]="isReordering" (ionItemReorder)="$event.applyTo(items)">
     <ion-item-sliding *ngFor="let item of items">
       <button ion-item (click)="clickedButton(item)">
         <h2>Sliding item {{item}}</h2>