Skip to content

Commit 5104de9

Browse files
brandyscarneybrandyscarney
authored
docs(item-sliding): update angular to standalone (#3939)
1 parent 0de1413 commit 5104de9

File tree

14 files changed

+246
-8
lines changed

14 files changed

+246
-8
lines changed

‎static/usage/v7/item-sliding/basic/angular/example_component_html.md

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
```html
2+
<ion-list>
3+
<ion-item-sliding>
4+
<ion-item>
5+
<ion-label>Sliding Item with End Options</ion-label>
6+
</ion-item>
7+
8+
<ion-item-options>
9+
<ion-item-option>Favorite</ion-item-option>
10+
<ion-item-option color="danger">Delete</ion-item-option>
11+
</ion-item-options>
12+
</ion-item-sliding>
13+
14+
<ion-item-sliding>
15+
<ion-item-options side="start">
16+
<ion-item-option color="success">Archive</ion-item-option>
17+
</ion-item-options>
18+
19+
<ion-item>
20+
<ion-label>Sliding Item with Start Options</ion-label>
21+
</ion-item>
22+
</ion-item-sliding>
23+
24+
<ion-item-sliding>
25+
<ion-item-options side="start">
26+
<ion-item-option color="success">Archive</ion-item-option>
27+
</ion-item-options>
28+
29+
<ion-item>
30+
<ion-label>Sliding Item with Options on Both Sides</ion-label>
31+
</ion-item>
32+
33+
<ion-item-options side="end">
34+
<ion-item-option>Favorite</ion-item-option>
35+
<ion-item-option color="danger">Delete</ion-item-option>
36+
</ion-item-options>
37+
</ion-item-sliding>
38+
</ion-list>
39+
```

‎static/usage/v7/item-sliding/basic/angular/example_component_ts.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
styleUrls: ['example.component.css'],
9+
imports: [IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList],
10+
})
11+
export class ExampleComponent {}
12+
```

‎static/usage/v7/item-sliding/basic/index.md

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,22 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
76

8-
<Playground version="7" code={{ javascript, react, vue, angular }} src="usage/v7/item-sliding/basic/demo.html" />
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
9+
10+
<Playground
11+
version="7"
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
23+
src="usage/v7/item-sliding/basic/demo.html"
24+
/>

‎static/usage/v7/item-sliding/expandable/angular/example_component_html.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
```html
2+
<ion-list>
3+
<ion-item-sliding>
4+
<ion-item-options side="start">
5+
<ion-item-option color="success" expandable>Archive</ion-item-option>
6+
</ion-item-options>
7+
8+
<ion-item>
9+
<ion-label>Sliding Item with Expandable Options</ion-label>
10+
</ion-item>
11+
12+
<ion-item-options side="end">
13+
<ion-item-option>Favorite</ion-item-option>
14+
<ion-item-option color="danger" expandable>Delete</ion-item-option>
15+
</ion-item-options>
16+
</ion-item-sliding>
17+
</ion-list>
18+
```

‎static/usage/v7/item-sliding/expandable/angular/example_component_ts.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
styleUrls: ['example.component.css'],
9+
imports: [IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList],
10+
})
11+
export class ExampleComponent {}
12+
```

‎static/usage/v7/item-sliding/expandable/index.md

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
6+
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
79

810
<Playground
911
version="7"
10-
code={{ javascript, react, vue, angular }}
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
1123
src="usage/v7/item-sliding/expandable/demo.html"
1224
size="100px"
1325
/>

‎static/usage/v7/item-sliding/icons/angular/example_component_ts.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
```ts
22
import { Component } from '@angular/core';
3+
import {
4+
IonIcon,
5+
IonItem,
6+
IonItemOption,
7+
IonItemOptions,
8+
IonItemSliding,
9+
IonLabel,
10+
IonList,
11+
} from '@ionic/angular/standalone';
312

413
import { addIcons } from 'ionicons';
514
import { archive, heart, trash } from 'ionicons/icons';
@@ -8,6 +17,7 @@ import { archive, heart, trash } from 'ionicons/icons';
817
selector: 'app-example',
918
templateUrl: 'example.component.html',
1019
styleUrls: ['example.component.css'],
20+
imports: [IonIcon, IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList],
1121
})
1222
export class ExampleComponent {
1323
constructor() {

‎static/usage/v8/item-sliding/basic/angular/example_component_html.md

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
```html
2+
<ion-list>
3+
<ion-item-sliding>
4+
<ion-item>
5+
<ion-label>Sliding Item with End Options</ion-label>
6+
</ion-item>
7+
8+
<ion-item-options>
9+
<ion-item-option>Favorite</ion-item-option>
10+
<ion-item-option color="danger">Delete</ion-item-option>
11+
</ion-item-options>
12+
</ion-item-sliding>
13+
14+
<ion-item-sliding>
15+
<ion-item-options side="start">
16+
<ion-item-option color="success">Archive</ion-item-option>
17+
</ion-item-options>
18+
19+
<ion-item>
20+
<ion-label>Sliding Item with Start Options</ion-label>
21+
</ion-item>
22+
</ion-item-sliding>
23+
24+
<ion-item-sliding>
25+
<ion-item-options side="start">
26+
<ion-item-option color="success">Archive</ion-item-option>
27+
</ion-item-options>
28+
29+
<ion-item>
30+
<ion-label>Sliding Item with Options on Both Sides</ion-label>
31+
</ion-item>
32+
33+
<ion-item-options side="end">
34+
<ion-item-option>Favorite</ion-item-option>
35+
<ion-item-option color="danger">Delete</ion-item-option>
36+
</ion-item-options>
37+
</ion-item-sliding>
38+
</ion-list>
39+
```

‎static/usage/v8/item-sliding/basic/angular/example_component_ts.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
styleUrls: ['example.component.css'],
9+
imports: [IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList],
10+
})
11+
export class ExampleComponent {}
12+
```

‎static/usage/v8/item-sliding/basic/index.md

Lines changed: 18 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,22 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
76

8-
<Playground version="8" code={{ javascript, react, vue, angular }} src="usage/v8/item-sliding/basic/demo.html" />
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
9+
10+
<Playground
11+
version="8"
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
23+
src="usage/v8/item-sliding/basic/demo.html"
24+
/>

‎static/usage/v8/item-sliding/expandable/angular/example_component_html.md

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
```html
2+
<ion-list>
3+
<ion-item-sliding>
4+
<ion-item-options side="start">
5+
<ion-item-option color="success" expandable>Archive</ion-item-option>
6+
</ion-item-options>
7+
8+
<ion-item>
9+
<ion-label>Sliding Item with Expandable Options</ion-label>
10+
</ion-item>
11+
12+
<ion-item-options side="end">
13+
<ion-item-option>Favorite</ion-item-option>
14+
<ion-item-option color="danger" expandable>Delete</ion-item-option>
15+
</ion-item-options>
16+
</ion-item-sliding>
17+
</ion-list>
18+
```

‎static/usage/v8/item-sliding/expandable/angular/example_component_ts.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
styleUrls: ['example.component.css'],
9+
imports: [IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList],
10+
})
11+
export class ExampleComponent {}
12+
```

‎static/usage/v8/item-sliding/expandable/index.md

Lines changed: 14 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,11 +3,23 @@ import Playground from '@site/src/components/global/Playground';
33
import javascript from './javascript.md';
44
import react from './react.md';
55
import vue from './vue.md';
6-
import angular from './angular.md';
6+
7+
import angular_example_component_html from './angular/example_component_html.md';
8+
import angular_example_component_ts from './angular/example_component_ts.md';
79

810
<Playground
911
version="8"
10-
code={{ javascript, react, vue, angular }}
12+
code={{
13+
javascript,
14+
react,
15+
vue,
16+
angular: {
17+
files: {
18+
'src/app/example.component.html': angular_example_component_html,
19+
'src/app/example.component.ts': angular_example_component_ts,
20+
},
21+
},
22+
}}
1123
src="usage/v8/item-sliding/expandable/demo.html"
1224
size="100px"
1325
/>

‎static/usage/v8/item-sliding/icons/angular/example_component_ts.md

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,14 @@
11
```ts
22
import { Component } from '@angular/core';
3+
import {
4+
IonIcon,
5+
IonItem,
6+
IonItemOption,
7+
IonItemOptions,
8+
IonItemSliding,
9+
IonLabel,
10+
IonList,
11+
} from '@ionic/angular/standalone';
312

413
import { addIcons } from 'ionicons';
514
import { archive, heart, trash } from 'ionicons/icons';
@@ -8,6 +17,7 @@ import { archive, heart, trash } from 'ionicons/icons';
817
selector: 'app-example',
918
templateUrl: 'example.component.html',
1019
styleUrls: ['example.component.css'],
20+
imports: [IonIcon, IonItem, IonItemOption, IonItemOptions, IonItemSliding, IonLabel, IonList],
1121
})
1222
export class ExampleComponent {
1323
constructor() {

0 commit comments

Comments
 (0)