diff --git a/src/components/item/item-sliding.ts b/src/components/item/item-sliding.ts index d4b9f65c75..08f9472239 100644 --- a/src/components/item/item-sliding.ts +++ b/src/components/item/item-sliding.ts @@ -7,46 +7,44 @@ import {List} from '../list/list'; * @name ItemSliding * * @description - * Creates a list-item that can easily be swiped, deleted, reordered, edited, and more. + * A sliding item is a list item that can be swiped to reveal buttons. It requires + * an [Item](../Item) component as a child and a [List](../../list/List) component as + * a parent. All buttons to reveal can be placed in the `` element. + * + * ### Button Layout + * If an icon is placed with text in the option button, by default it will + * display the icon on top of the text. This can be changed to display the icon + * to the left of the text by setting `icon-left` as an attribute on the + * `` element. + * + * ```html + * + * + * + * ``` + * * * @usage * ```html * - * - * + * + * + * Item + * * * - * + * * * * * ``` - * ItemSliding can be closed by API by adding #slidingItem in ion-item-sliding. - * We grab a reference to the item reference by pass the `#slidingItem` to the share method. - * - * ```html - * - * - * - * - * - * - * - * - * ``` - * - * ```typescript - * share(item, slidingItem) { - * slidingItem.close(); - * } - * ``` * * @demo /docs/v2/demos/item-sliding/ * @see {@link /docs/v2/components#lists List Component Docs} + * @see {@link ../Item Item API Docs} * @see {@link ../../list/List List API Docs} */ @Component({ @@ -65,7 +63,37 @@ export class ItemSliding { } /** - * @private + * Close the sliding item. Items can also be closed from the [List](../../list/List). + * + * The sliding item can be closed by garbbing a reference to `ItemSliding`. In the + * below example, the template reference variable `slidingItem` is placed on the element + * and passed to the `share` method. + * + * ```html + * + * + * + * Item + * + * + * + * + * + * + * ``` + * + * ```ts + * import {Page, ItemSliding} from 'ionic-angular'; + * + * @Page({}) + * export class MyClass { + * constructor() { } + * + * share(slidingItem: ItemSliding) { + * slidingItem.close(); + * } + * } + * ``` */ close() { this._list.closeSlidingItems(); diff --git a/src/components/list/list.ts b/src/components/list/list.ts index 1bfce1f86b..ef13a18823 100644 --- a/src/components/list/list.ts +++ b/src/components/list/list.ts @@ -49,18 +49,21 @@ export class List extends Ion { } /** - * Enable sliding items if your page has them + * Enable the sliding items. * * ```ts * import {Page, List} from 'ionic-angular'; * import {ViewChild} from '@angular/core'; - * @Page... + * + * @Page({}) * export class MyClass { - * @ViewChild(List) list: List; - * constructor(){} - * stopSliding(){ - * this.list.enableSlidingItems(false); - * } + * @ViewChild(List) list: List; + * + * constructor() { } + * + * stopSliding() { + * this.list.enableSlidingItems(false); + * } * } * ``` * @param {boolean} shouldEnable whether the item-sliding should be enabled or not @@ -84,18 +87,21 @@ export class List extends Ion { } /** - * Enable sliding items if your page has + * Close the open sliding item. * * ```ts * import {Page, List} from 'ionic-angular'; * import {ViewChild} from '@angular/core'; - * @Page... + * + * @Page({}) * export class MyClass { - * @ViewChild(List) list: List; - * constructor(){} - * closeItems(){ - * this.list.closeSlidingItems(); - * } + * @ViewChild(List) list: List; + * + * constructor() { } + * + * closeItems() { + * this.list.closeSlidingItems(); + * } * } * ``` */ diff --git a/src/components/tabs/tabs.ts b/src/components/tabs/tabs.ts index 30ff37f931..65eecf694e 100644 --- a/src/components/tabs/tabs.ts +++ b/src/components/tabs/tabs.ts @@ -114,7 +114,7 @@ import {isBlank, isTrueProperty} from '../../util/util'; *```ts * export class TabsPage { * - * @ViewChild('myTabs) tabRef: Tabs + * @ViewChild('myTabs') tabRef: Tabs; * * onPageDidEnter() { * this.tabRef.select(2);