Skip to content

Commit

Permalink
docs(nav): update angular to standalone (#3948)
Browse files Browse the repository at this point in the history
  • Loading branch information
brandyscarney authored Dec 30, 2024
1 parent 54d8a22 commit d1bbf70
Showing 25 changed files with 88 additions and 102 deletions.
21 changes: 0 additions & 21 deletions static/usage/v7/nav/modal-navigation/angular/app_module_ts.md

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,15 +1,26 @@
```ts
import { Component, ViewChild } from '@angular/core';
import { IonNav } from '@ionic/angular';
import {
IonButton,
IonButtons,
IonContent,
IonHeader,
IonModal,
IonNav,
IonTitle,
IonToolbar,
} from '@ionic/angular/standalone';

import { PageOneComponent } from './page-one.component';

@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
styleUrls: ['example.component.css'],
imports: [IonButton, IonButtons, IonContent, IonHeader, IonModal, IonNav, IonTitle, IonToolbar],
})
export class ExampleComponent {
@ViewChild('nav') private nav: IonNav;
@ViewChild('nav') private nav!: IonNav;

onWillPresent() {
this.nav.setRoot(PageOneComponent);
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular';
import { IonButton, IonContent, IonNav } from '@ionic/angular/standalone';

import { PageTwoComponent } from './page-two.component';

@@ -12,6 +12,7 @@ import { PageTwoComponent } from './page-two.component';
<ion-button (click)="navigateToPageTwo()">Go to Page Two</ion-button>
</ion-content>
`,
imports: [IonButton, IonContent],
})
export class PageOneComponent {
constructor(private nav: IonNav) {}
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular';
import { IonButton, IonContent, IonNav } from '@ionic/angular/standalone';

@Component({
selector: 'app-page-one',
@@ -11,6 +11,7 @@ import { IonNav } from '@ionic/angular';
<ion-button (click)="navigateToRoot()">Go to Root</ion-button>
</ion-content>
`,
imports: [IonButton, IonContent],
})
export class PageThreeComponent {
constructor(private nav: IonNav) {}
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular';
import { IonButton, IonContent, IonNav } from '@ionic/angular/standalone';

import { PageThreeComponent } from './page-three.component';

@@ -12,6 +12,7 @@ import { PageThreeComponent } from './page-three.component';
<ion-button (click)="navigateToPageThree()">Go to Page Three</ion-button>
</ion-content>
`,
imports: [IonButton, IonContent],
})
export class PageTwoComponent {
component = PageThreeComponent;
2 changes: 0 additions & 2 deletions static/usage/v7/nav/modal-navigation/index.md
Original file line number Diff line number Diff line change
@@ -2,7 +2,6 @@ import Playground from '@site/src/components/global/Playground';

import javascript from './javascript.md';

import angular_app_module_ts from './angular/app_module_ts.md';
import angular_example_component_ts from './angular/example_component_ts.md';
import angular_example_component_html from './angular/example_component_html.md';
import angular_page_one_component_ts from './angular/page_one_component_ts.md';
@@ -30,7 +29,6 @@ import vue_page_three from './vue/page_three_vue.md';
'src/app/page-one.component.ts': angular_page_one_component_ts,
'src/app/page-two.component.ts': angular_page_two_component_ts,
'src/app/page-three.component.ts': angular_page_three_component_ts,
'src/app/app.module.ts': angular_app_module_ts,
},
},
react: {
21 changes: 0 additions & 21 deletions static/usage/v7/nav/nav-link/angular/app_module_ts.md

This file was deleted.

3 changes: 3 additions & 0 deletions static/usage/v7/nav/nav-link/angular/example_component_ts.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,14 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular/standalone';

import { PageOneComponent } from './page-one.component';

@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
styleUrls: ['example.component.css'],
imports: [IonNav],
})
export class ExampleComponent {
component = PageOneComponent;
2 changes: 2 additions & 0 deletions static/usage/v7/nav/nav-link/angular/page_one_component_ts.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonButton, IonContent, IonHeader, IonNavLink, IonTitle, IonToolbar } from '@ionic/angular/standalone';

import { PageTwoComponent } from './page-two.component';

@@ -18,6 +19,7 @@ import { PageTwoComponent } from './page-two.component';
</ion-nav-link>
</ion-content>
`,
imports: [IonButton, IonContent, IonHeader, IonNavLink, IonTitle, IonToolbar],
})
export class PageOneComponent {
component = PageTwoComponent;
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonBackButton, IonButtons, IonContent, IonHeader, IonTitle, IonToolbar } from '@ionic/angular/standalone';

@Component({
selector: 'app-page-one',
@@ -16,6 +17,7 @@ import { Component } from '@angular/core';
<h1>Page Three</h1>
</ion-content>
`,
imports: [IonBackButton, IonButtons, IonContent, IonHeader, IonTitle, IonToolbar],
})
export class PageThreeComponent {}
```
11 changes: 11 additions & 0 deletions static/usage/v7/nav/nav-link/angular/page_two_component_ts.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,15 @@
```ts
import { Component } from '@angular/core';
import {
IonBackButton,
IonButton,
IonButtons,
IonContent,
IonHeader,
IonNavLink,
IonTitle,
IonToolbar,
} from '@ionic/angular/standalone';

import { PageThreeComponent } from './page-three.component';

@@ -23,6 +33,7 @@ import { PageThreeComponent } from './page-three.component';
</div>
</ion-content>
`,
imports: [IonBackButton, IonButton, IonButtons, IonContent, IonHeader, IonNavLink, IonTitle, IonToolbar],
})
export class PageTwoComponent {
component = PageThreeComponent;
2 changes: 0 additions & 2 deletions static/usage/v7/nav/nav-link/index.md
Original file line number Diff line number Diff line change
@@ -2,7 +2,6 @@ import Playground from '@site/src/components/global/Playground';

import javascript from './javascript.md';

import angular_app_module_ts from './angular/app_module_ts.md';
import angular_example_component_html from './angular/example_component_html.md';
import angular_example_component_ts from './angular/example_component_ts.md';
import angular_page_one_component_ts from './angular/page_one_component_ts.md';
@@ -30,7 +29,6 @@ import vue_page_three from './vue/page_three_vue.md';
'src/app/page-one.component.ts': angular_page_one_component_ts,
'src/app/page-two.component.ts': angular_page_two_component_ts,
'src/app/page-three.component.ts': angular_page_three_component_ts,
'src/app/app.module.ts': angular_app_module_ts,
},
},
react: {
21 changes: 0 additions & 21 deletions static/usage/v8/nav/modal-navigation/angular/app_module_ts.md

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,15 +1,26 @@
```ts
import { Component, ViewChild } from '@angular/core';
import { IonNav } from '@ionic/angular';
import {
IonButton,
IonButtons,
IonContent,
IonHeader,
IonModal,
IonNav,
IonTitle,
IonToolbar,
} from '@ionic/angular/standalone';

import { PageOneComponent } from './page-one.component';

@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
styleUrls: ['example.component.css'],
imports: [IonButton, IonButtons, IonContent, IonHeader, IonModal, IonNav, IonTitle, IonToolbar],
})
export class ExampleComponent {
@ViewChild('nav') private nav: IonNav;
@ViewChild('nav') private nav!: IonNav;

onWillPresent() {
this.nav.setRoot(PageOneComponent);
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular';
import { IonButton, IonContent, IonNav } from '@ionic/angular/standalone';

import { PageTwoComponent } from './page-two.component';

@@ -12,6 +12,7 @@ import { PageTwoComponent } from './page-two.component';
<ion-button (click)="navigateToPageTwo()">Go to Page Two</ion-button>
</ion-content>
`,
imports: [IonButton, IonContent],
})
export class PageOneComponent {
constructor(private nav: IonNav) {}
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular';
import { IonButton, IonContent, IonNav } from '@ionic/angular/standalone';

@Component({
selector: 'app-page-one',
@@ -11,6 +11,7 @@ import { IonNav } from '@ionic/angular';
<ion-button (click)="navigateToRoot()">Go to Root</ion-button>
</ion-content>
`,
imports: [IonButton, IonContent],
})
export class PageThreeComponent {
constructor(private nav: IonNav) {}
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular';
import { IonButton, IonContent, IonNav } from '@ionic/angular/standalone';

import { PageThreeComponent } from './page-three.component';

@@ -12,6 +12,7 @@ import { PageThreeComponent } from './page-three.component';
<ion-button (click)="navigateToPageThree()">Go to Page Three</ion-button>
</ion-content>
`,
imports: [IonButton, IonContent],
})
export class PageTwoComponent {
component = PageThreeComponent;
2 changes: 0 additions & 2 deletions static/usage/v8/nav/modal-navigation/index.md
Original file line number Diff line number Diff line change
@@ -2,7 +2,6 @@ import Playground from '@site/src/components/global/Playground';

import javascript from './javascript.md';

import angular_app_module_ts from './angular/app_module_ts.md';
import angular_example_component_ts from './angular/example_component_ts.md';
import angular_example_component_html from './angular/example_component_html.md';
import angular_page_one_component_ts from './angular/page_one_component_ts.md';
@@ -30,7 +29,6 @@ import vue_page_three from './vue/page_three_vue.md';
'src/app/page-one.component.ts': angular_page_one_component_ts,
'src/app/page-two.component.ts': angular_page_two_component_ts,
'src/app/page-three.component.ts': angular_page_three_component_ts,
'src/app/app.module.ts': angular_app_module_ts,
},
},
react: {
21 changes: 0 additions & 21 deletions static/usage/v8/nav/nav-link/angular/app_module_ts.md

This file was deleted.

3 changes: 3 additions & 0 deletions static/usage/v8/nav/nav-link/angular/example_component_ts.md
Original file line number Diff line number Diff line change
@@ -1,11 +1,14 @@
```ts
import { Component } from '@angular/core';
import { IonNav } from '@ionic/angular/standalone';

import { PageOneComponent } from './page-one.component';

@Component({
selector: 'app-example',
templateUrl: 'example.component.html',
styleUrls: ['example.component.css'],
imports: [IonNav],
})
export class ExampleComponent {
component = PageOneComponent;
2 changes: 2 additions & 0 deletions static/usage/v8/nav/nav-link/angular/page_one_component_ts.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,6 @@
```ts
import { Component } from '@angular/core';
import { IonButton, IonContent, IonHeader, IonNavLink, IonTitle, IonToolbar } from '@ionic/angular/standalone';

import { PageTwoComponent } from './page-two.component';

@@ -18,6 +19,7 @@ import { PageTwoComponent } from './page-two.component';
</ion-nav-link>
</ion-content>
`,
imports: [IonButton, IonContent, IonHeader, IonNavLink, IonTitle, IonToolbar],
})
export class PageOneComponent {
component = PageTwoComponent;
Loading

0 comments on commit d1bbf70

Please sign in to comment.