diff --git a/static/usage/v8/picker-legacy/controller/angular/example_component_ts.md b/static/usage/v8/picker-legacy/controller/angular/example_component_ts.md index 16f56cd0ca7..35edd60c597 100644 --- a/static/usage/v8/picker-legacy/controller/angular/example_component_ts.md +++ b/static/usage/v8/picker-legacy/controller/angular/example_component_ts.md @@ -1,10 +1,12 @@ ```ts import { Component } from '@angular/core'; -import { PickerController } from '@ionic/angular'; +import { IonButton, PickerController } from '@ionic/angular/standalone'; @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonButton], }) export class ExampleComponent { constructor(private pickerCtrl: PickerController) {} diff --git a/static/usage/v8/picker-legacy/inline/isOpen/angular/example_component_ts.md b/static/usage/v8/picker-legacy/inline/isOpen/angular/example_component_ts.md index 69a5fb611aa..d2f1144a794 100644 --- a/static/usage/v8/picker-legacy/inline/isOpen/angular/example_component_ts.md +++ b/static/usage/v8/picker-legacy/inline/isOpen/angular/example_component_ts.md @@ -1,9 +1,19 @@ ```ts import { Component } from '@angular/core'; +import { IonButton, IonPickerLegacy } from '@ionic/angular/standalone'; + +interface PickerValue { + languages: { + text: string; + value: string; + }; +} @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonButton, IonPickerLegacy], }) export class ExampleComponent { isPickerOpen = false; @@ -39,7 +49,7 @@ export class ExampleComponent { }, { text: 'Confirm', - handler: (value) => { + handler: (value: PickerValue) => { console.log(`You selected: ${value.languages.value}`); }, }, diff --git a/static/usage/v8/picker-legacy/inline/trigger/angular/example_component_ts.md b/static/usage/v8/picker-legacy/inline/trigger/angular/example_component_ts.md index 7a638c60964..31eb752d4a9 100644 --- a/static/usage/v8/picker-legacy/inline/trigger/angular/example_component_ts.md +++ b/static/usage/v8/picker-legacy/inline/trigger/angular/example_component_ts.md @@ -1,9 +1,19 @@ ```ts import { Component } from '@angular/core'; +import { IonButton, IonPickerLegacy } from '@ionic/angular/standalone'; + +interface PickerValue { + languages: { + text: string; + value: string; + }; +} @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonButton, IonPickerLegacy], }) export class ExampleComponent { public pickerColumns = [ @@ -37,7 +47,7 @@ export class ExampleComponent { }, { text: 'Confirm', - handler: (value) => { + handler: (value: PickerValue) => { console.log(`You selected: ${value.languages.value}`); }, }, diff --git a/static/usage/v8/picker-legacy/multiple-column/angular/example_component_ts.md b/static/usage/v8/picker-legacy/multiple-column/angular/example_component_ts.md index 6f252e19dc9..5ac50ceecf7 100644 --- a/static/usage/v8/picker-legacy/multiple-column/angular/example_component_ts.md +++ b/static/usage/v8/picker-legacy/multiple-column/angular/example_component_ts.md @@ -1,9 +1,27 @@ ```ts import { Component } from '@angular/core'; +import { IonButton, IonPickerLegacy } from '@ionic/angular/standalone'; + +interface PickerValue { + meat: { + text: string; + value: string; + }; + veggies: { + text: string; + value: string; + }; + crust: { + text: string; + value: string; + }; +} @Component({ selector: 'app-example', templateUrl: 'example.component.html', + styleUrls: ['example.component.css'], + imports: [IonButton, IonPickerLegacy], }) export class ExampleComponent { public pickerColumns = [ @@ -67,7 +85,7 @@ export class ExampleComponent { }, { text: 'Confirm', - handler: (value) => { + handler: (value: PickerValue) => { console.log(`You selected a ${value.crust.text} pizza with ${value.meat.text} and ${value.veggies.text}`); }, },