diff --git a/src/app/shop/color-picker/color-picker-dialog/color-picker-dialog.component.ts b/src/app/shop/color-picker/color-picker-dialog/color-picker-dialog.component.ts index abbc8a1..5aa9f58 100644 --- a/src/app/shop/color-picker/color-picker-dialog/color-picker-dialog.component.ts +++ b/src/app/shop/color-picker/color-picker-dialog/color-picker-dialog.component.ts @@ -13,6 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { LiveAnnouncer } from '@angular/cdk/a11y'; import { Component, EventEmitter, OnInit, Output } from '@angular/core'; import { MatDialogRef } from '@angular/material/dialog'; @@ -44,7 +45,8 @@ export class ColorPickerDialogComponent implements OnInit { ]; // TODO: #11. Announce changes with LiveAnnouncer - constructor(public dialogRef: MatDialogRef) { } + constructor(public dialogRef: MatDialogRef, + private liveAnnouncer: LiveAnnouncer) { } ngOnInit(): void { } @@ -54,6 +56,7 @@ export class ColorPickerDialogComponent implements OnInit { } // TODO: #11. Announce changes with LiveAnnouncer + this.liveAnnouncer.announce(`Select color: ${color}`); this.dialogRef.close(); } diff --git a/src/app/shop/shop.component.ts b/src/app/shop/shop.component.ts index 7b12105..a4bcd82 100644 --- a/src/app/shop/shop.component.ts +++ b/src/app/shop/shop.component.ts @@ -13,6 +13,7 @@ * See the License for the specific language governing permissions and * limitations under the License. */ +import { LiveAnnouncer } from '@angular/cdk/a11y'; import { Component, OnInit } from '@angular/core'; @Component({ @@ -29,7 +30,7 @@ export class ShopComponent implements OnInit { selectedFillings: string[] = []; // TODO: #11. Announce changes with LiveAnnouncer - constructor() { } + constructor(private liveAnnouncer: LiveAnnouncer) { } ngOnInit(): void { } @@ -53,5 +54,6 @@ export class ShopComponent implements OnInit { console.log(fakePurchase); // TODO: #11. Announce changes with LiveAnnouncer + this.liveAnnouncer.announce(fakePurchase); } }