Skip to content

Commit b11a217

Browse files
brandyscarneybrandyscarney
committed
docs(popover): update angular to standalone
1 parent c5926f0 commit b11a217

File tree

30 files changed

+340
-16
lines changed

30 files changed

+340
-16
lines changed

‎static/usage/v7/popover/customization/positioning/angular/example_component_ts.md‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,12 @@
11
```ts
22
import { Component } from '@angular/core';
3+
import { IonButton, IonContent, IonPopover } from '@ionic/angular/standalone';
34

45
@Component({
56
selector: 'app-example',
67
templateUrl: 'example.component.html',
78
styleUrls: ['example.component.css'],
9+
imports: [IonButton, IonContent, IonPopover],
810
})
911
export class ExampleComponent {}
1012
```

‎static/usage/v7/popover/customization/sizing/angular/example_component_html.md‎

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
```html
2+
<ion-button id="auto-trigger">Size=Auto</ion-button>
3+
<ion-popover trigger="auto-trigger" size="auto">
4+
<ng-template>
5+
<ion-content class="ion-padding">Hello!</ion-content>
6+
</ng-template>
7+
</ion-popover>
8+
9+
<ion-button id="cover-trigger">Size=Cover</ion-button>
10+
<ion-popover trigger="cover-trigger" size="cover">
11+
<ng-template>
12+
<ion-content class="ion-padding">Hello!</ion-content>
13+
</ng-template>
14+
</ion-popover>
15+
```

‎static/usage/v7/popover/customization/sizing/angular/example_component_ts.md‎

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 { IonButton, IonContent, IonPopover } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonButton, IonContent, IonPopover],
9+
})
10+
export class ExampleComponent {}
11+
```

‎static/usage/v7/popover/customization/sizing/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"
1012
size="300px"
11-
code={{ javascript, react, vue, angular }}
13+
code={{
14+
javascript,
15+
react,
16+
vue,
17+
angular: {
18+
files: {
19+
'src/app/example.component.html': angular_example_component_html,
20+
'src/app/example.component.ts': angular_example_component_ts,
21+
},
22+
},
23+
}}
1224
src="usage/v7/popover/customization/sizing/demo.html"
1325
/>

‎static/usage/v7/popover/nested/angular/example_component_html.md‎

Lines changed: 24 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
```html
2+
<ion-button id="popover-button">Open Menu</ion-button>
3+
<ion-popover trigger="popover-button" [dismissOnSelect]="true">
4+
<ng-template>
5+
<ion-content>
6+
<ion-list>
7+
<ion-item [button]="true" [detail]="false">Option 1</ion-item>
8+
<ion-item [button]="true" [detail]="false">Option 2</ion-item>
9+
<ion-item [button]="true" id="nested-trigger">More options...</ion-item>
10+
11+
<ion-popover trigger="nested-trigger" [dismissOnSelect]="true" side="end">
12+
<ng-template>
13+
<ion-content>
14+
<ion-list>
15+
<ion-item [button]="true" [detail]="false">Nested option</ion-item>
16+
</ion-list>
17+
</ion-content>
18+
</ng-template>
19+
</ion-popover>
20+
</ion-list>
21+
</ion-content>
22+
</ng-template>
23+
</ion-popover>
24+
```

‎static/usage/v7/popover/nested/angular/example_component_ts.md‎

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 { IonButton, IonContent, IonItem, IonList, IonPopover } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonButton, IonContent, IonItem, IonList, IonPopover],
9+
})
10+
export class ExampleComponent {}
11+
```

‎static/usage/v7/popover/nested/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"
1012
size="medium"
11-
code={{ javascript, react, vue, angular }}
13+
code={{
14+
javascript,
15+
react,
16+
vue,
17+
angular: {
18+
files: {
19+
'src/app/example.component.html': angular_example_component_html,
20+
'src/app/example.component.ts': angular_example_component_ts,
21+
},
22+
},
23+
}}
1224
src="usage/v7/popover/nested/demo.html"
1325
/>

‎static/usage/v7/popover/performance/mount/angular/example_component_html.md‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
```html
2+
<ion-button id="open-popover">Open Popover</ion-button>
3+
<ion-popover [keepContentsMounted]="true" trigger="open-popover">
4+
<ng-template>
5+
<ion-content class="ion-padding">This content was mounted as soon as the popover was created.</ion-content>
6+
</ng-template>
7+
</ion-popover>
8+
```

‎static/usage/v7/popover/performance/mount/angular/example_component_ts.md‎

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 { IonButton, IonContent, IonPopover } from '@ionic/angular/standalone';
4+
5+
@Component({
6+
selector: 'app-example',
7+
templateUrl: 'example.component.html',
8+
imports: [IonButton, IonContent, IonPopover],
9+
})
10+
export class ExampleComponent {}
11+
```

‎static/usage/v7/popover/performance/mount/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
size="medium"
1724
src="usage/v7/popover/performance/mount/demo.html"

0 commit comments

Comments
 (0)