|
|
@ -14,24 +14,21 @@ import { debounce, debounceTime, distinctUntilChanged, filter, map } from 'rxjs/ |
|
|
|
templateUrl: './app.component.html', |
|
|
|
styleUrls: ['./app.component.css'], |
|
|
|
}) |
|
|
|
export class AppComponent implements OnInit, OnDestroy { |
|
|
|
readonly condition = new FormControl(); |
|
|
|
readonly stop$=new Subject<void>(); |
|
|
|
ngOnInit():void{ |
|
|
|
this.condition.valueChanges |
|
|
|
.pipe( |
|
|
|
debounceTime(500), |
|
|
|
filter((condition:string)=> !!condition), |
|
|
|
distinctUntilChanged(), |
|
|
|
takeUntil(this.stop$) |
|
|
|
) |
|
|
|
.subscribe({ |
|
|
|
next:(condition) =>console.log(`查詢條件:${condition}`), |
|
|
|
}); |
|
|
|
} |
|
|
|
export class AppComponent { |
|
|
|
|
|
|
|
constructor(private fb: FormBuilder) { } |
|
|
|
readonly form = this.fb.group({ |
|
|
|
subject: this.fb.control(''), |
|
|
|
content: this.fb.control(''), |
|
|
|
}); |
|
|
|
|
|
|
|
ngOnDestroy():void{ |
|
|
|
this.stop$.next(); |
|
|
|
this.stop$.complete(); |
|
|
|
onSetValue(): void { |
|
|
|
this.form.setValue({ subject: 'Task A', content: '' }); |
|
|
|
} |
|
|
|
onPatchValue(): void { |
|
|
|
this.form.patchValue({subject:'Task A'}); |
|
|
|
} |
|
|
|
onReset():void{ |
|
|
|
this.form.reset({subject:'', content:''}); |
|
|
|
} |
|
|
|
} |