Skip to content

Commit 6960bb1

Browse files
committed
docs(radio): update angular to standalone
1 parent c5926f0 commit 6960bb1

38 files changed

+534
-24
lines changed
Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
```html
2+
<ion-list>
3+
<ion-radio-group value="start">
4+
<ion-item>
5+
<ion-radio value="start" labelPlacement="stacked" alignment="start">Aligned to the Start</ion-radio>
6+
</ion-item>
7+
</ion-radio-group>
8+
9+
<ion-radio-group value="center">
10+
<ion-item>
11+
<ion-radio value="center" labelPlacement="stacked" alignment="center">Aligned to the Center</ion-radio>
12+
</ion-item>
13+
</ion-radio-group>
14+
</ion-list>
15+
```
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonItem, IonList, IonRadio, IonRadioGroup } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonItem, IonList, IonRadio, IonRadioGroup],
9+
})
10+
export class ExampleComponent {}
11+
```

static/usage/v7/radio/alignment/index.md

Lines changed: 9 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,15 +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';
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"
1012
code={{
1113
javascript,
1214
react,
1315
vue,
14-
angular,
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+
},
1522
}}
1623
src="usage/v7/radio/alignment/demo.html"
1724
/>
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
```html
2+
<ion-radio-group value="strawberries">
3+
<ion-radio value="grapes">Grapes</ion-radio><br />
4+
<ion-radio value="strawberries">Strawberries</ion-radio><br />
5+
<ion-radio value="pineapple">Pineapple</ion-radio><br />
6+
<ion-radio value="cherries">Cherries</ion-radio>
7+
</ion-radio-group>
8+
```
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonRadio, IonRadioGroup } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonRadio, IonRadioGroup],
9+
})
10+
export class ExampleComponent {}
11+
```

static/usage/v7/radio/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/radio/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/radio/basic/demo.html"
24+
/>
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
```html
2+
<ion-radio-group [allowEmptySelection]="true" value="turtles">
3+
<ion-radio value="dogs">Dogs</ion-radio><br />
4+
<ion-radio value="cats">Cats</ion-radio><br />
5+
<ion-radio value="turtles">Turtles</ion-radio><br />
6+
<ion-radio value="fish">Fish</ion-radio><br />
7+
</ion-radio-group>
8+
```
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
```ts
2+
import { Component } from '@angular/core';
3+
import { IonRadio, IonRadioGroup } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonRadio, IonRadioGroup],
9+
})
10+
export class ExampleComponent {}
11+
```

static/usage/v7/radio/empty-selection/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/radio/empty-selection/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/radio/empty-selection/demo.html"
24+
/>
Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
```html
2+
<ion-list>
3+
<ion-radio-group value="start">
4+
<ion-item>
5+
<ion-radio value="start" justify="start">Packed at the Start of Line</ion-radio>
6+
</ion-item>
7+
</ion-radio-group>
8+
9+
<ion-radio-group value="end">
10+
<ion-item>
11+
<ion-radio value="end" justify="end">Packed at the End of Line</ion-radio>
12+
</ion-item>
13+
</ion-radio-group>
14+
15+
<ion-radio-group value="space-between">
16+
<ion-item>
17+
<ion-radio value="space-between" justify="space-between">Space Between Label and Control</ion-radio>
18+
</ion-item>
19+
</ion-radio-group>
20+
</ion-list>
21+
```

0 commit comments

Comments
 (0)