角型コントロールvalueChangesが機能しない

Question

サブスクリプションで変更された場合、私のフォーム（ "ファミリー"）の値を取得したいのですが、コンソールのログに何もないので何か間違っているようです。

import { Component , AfterViewInit } from '@angular/core'; 
import {FormGroup,FormBuilder} from '@angular/forms'; 
import {Observable} from 'rxjs/Rx'; 

@Component({ 
selector: 'app-root', 
template: `<h1>Hello World!</h1> 
      <form [formGroup]="frm1"> 
      <input type="text" formControlName="name" > 
      <input type="text" formControlName="family"> 
      </form> 
      `, 

}) 

export class AppComponent implements AfterViewInit{ 

frm1 : FormGroup; 

constructor(fb:FormBuilder){ 
    this.frm1 = fb.group({ 
     name : [], 
     family: [] 
    });  
} 
ngAfterViewInit(){ 
    var search = this.frm1.controls.family; 
    search.valueChanges.subscribe(x => console.log(x));  
} 
} 

Answer 1

使用フォーム変数のget方法frm1

ngOnInit(){ 
     this.frm1.get('family').valueChanges.subscribe(x => console.log(x)); 
} 

Answer 2

このお試しください： `チェンジ（）あなたのHTMLの入力フィールドに`イベントハンドラを使用しないのはなぜ

import { Component , AfterViewInit, OnInit } from '@angular/core'; 
import {FormGroup,FormBuilder} from '@angular/forms'; 
import {Observable} from 'rxjs/Rx'; 

@Component({ 
selector: 'app-root', 
template: `<h1>Hello World!</h1> 
     <form [formGroup]="frm1"> 
     <input type="text" formControlName="name" > 
     <input type="text" formControlName="family"> 
     </form>`}) 

export class AppComponent implements AfterViewInit, OnInit{ 

frm1 : FormGroup; 

constructor(private formBuilder: FormBuilder){} 

ngOnInit(): void { 
    this.formInit(); 
    this.formSet(); 
} 

formInit(): void { 
    this.frm1 = this.formBuilder.group({ 
     name: [''], 
     family[''] 
    }) 
} 

formSet(): void { 
    const editForm = { 
     name: 'test-name', 
     family: 'test familty', 
    }; 
    this.frm1.patchValue(editForm) 
} 

ngAfterViewInit(){ 
this.frm1 .controls.family.valueChanges.subscribe(
     () => { 
       console.log(this.frm1 .controls.family.value) 
      } 
     ) 
     } 
}