docs: move start tutorial alert for clarity (#42764)
The alert was placed in the middle of a set of steps, which was causing some confusion. This has been moved to the above the steps in the section and slightly reworded to make it clearer. Fixes #42752 PR Close #42764
This commit is contained in:
parent
b5ab7aff43
commit
a524af15a5
|
@ -219,6 +219,13 @@ The Phone XL price is over $700, so the **Notify Me** button appears on that pro
|
|||
To make the **Notify Me** button work, the child component needs to notify and pass the data to the parent component.
|
||||
The `ProductAlertsComponent` needs to emit an event when the user clicks **Notify Me** and the `ProductListComponent` needs to respond to the event.
|
||||
|
||||
<div class="alert is-helpful">
|
||||
|
||||
In new components, the Angular Generator includes an empty `constructor()`, the `OnInit` interface, and the `ngOnInit()` method.
|
||||
Since these steps don't use them, the following code examples omit them for brevity.
|
||||
|
||||
</div>
|
||||
|
||||
1. In `product-alerts.component.ts`, import `Output` and `EventEmitter` from `@angular/core`.
|
||||
|
||||
<code-example header="src/app/product-alerts/product-alerts.component.ts" path="getting-started/src/app/product-alerts/product-alerts.component.ts" region="imports"></code-example>
|
||||
|
@ -228,13 +235,6 @@ The `ProductAlertsComponent` needs to emit an event when the user clicks **Notif
|
|||
|
||||
<code-example path="getting-started/src/app/product-alerts/product-alerts.component.ts" header="src/app/product-alerts/product-alerts.component.ts" region="input-output"></code-example>
|
||||
|
||||
<div class="alert is-helpful">
|
||||
|
||||
In new components, the Angular Generator includes an empty `constructor()`, the `OnInit` interface, and the `ngOnInit()` method.
|
||||
Since these steps don't use them, the following code example omits them for brevity.
|
||||
|
||||
</div>
|
||||
|
||||
1. In `product-alerts.component.html`, update the **Notify Me** button with an event binding to call the `notify.emit()` method.
|
||||
|
||||
<code-example header="src/app/product-alerts/product-alerts.component.html" path="getting-started/src/app/product-alerts/product-alerts.component.html"></code-example>
|
||||
|
|
Loading…
Reference in New Issue