docs: refactor `HeroDetailComponent` and unit test (#42349)
remove `@Input()` decorator from `hero` property because the component is designed to get the hero via a service, not an input binding. add `HTMLElement` type to `HeroDetailComponent` unit test PR Close #42349
This commit is contained in:
parent
c110d050f2
commit
74ebdf6fdc
|
@ -193,9 +193,9 @@ function heroModuleSetup() {
|
||||||
// #docregion title-case-pipe
|
// #docregion title-case-pipe
|
||||||
it('should convert hero name to Title Case', () => {
|
it('should convert hero name to Title Case', () => {
|
||||||
// get the name's input and display elements from the DOM
|
// get the name's input and display elements from the DOM
|
||||||
const hostElement = fixture.nativeElement;
|
const hostElement: HTMLElement = fixture.nativeElement;
|
||||||
const nameInput: HTMLInputElement = hostElement.querySelector('input');
|
const nameInput: HTMLInputElement = hostElement.querySelector('input')!;
|
||||||
const nameDisplay: HTMLElement = hostElement.querySelector('span');
|
const nameDisplay: HTMLElement = hostElement.querySelector('span')!;
|
||||||
|
|
||||||
// simulate user entering a new name into the input box
|
// simulate user entering a new name into the input box
|
||||||
nameInput.value = 'quick BROWN fOx';
|
nameInput.value = 'quick BROWN fOx';
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
/* tslint:disable:member-ordering */
|
/* tslint:disable:member-ordering */
|
||||||
// #docplaster
|
// #docplaster
|
||||||
import { Component, Input, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { ActivatedRoute, Router } from '@angular/router';
|
import { ActivatedRoute, Router } from '@angular/router';
|
||||||
|
|
||||||
import { Hero } from '../model/hero';
|
import { Hero } from '../model/hero';
|
||||||
|
@ -23,7 +23,7 @@ export class HeroDetailComponent implements OnInit {
|
||||||
// #enddocregion ctor
|
// #enddocregion ctor
|
||||||
// #enddocregion prototype
|
// #enddocregion prototype
|
||||||
|
|
||||||
@Input() hero!: Hero;
|
hero!: Hero;
|
||||||
|
|
||||||
// #docregion ng-on-init
|
// #docregion ng-on-init
|
||||||
ngOnInit(): void {
|
ngOnInit(): void {
|
||||||
|
|
Loading…
Reference in New Issue