Question

我希望在角度2的几次（几毫秒或几秒）之后从输入文本中获取值，当自定义写入输入但没有等待他点击按钮时。

我试过这个，但即使我使用debounceTime，每次按键都会发送值。

我尝试了解debounce和observable，这就是我的理解，任何人都可以帮我修改我的代码：

component.html：

<md-card-title *ngIf="!edit">{{card.title}}</md-card-title>
 <input *ngIf="edit" type="text" [(ngModel)]="card.title" (ngModelChange)='rename()'/>

component.ts

newTitle: string;
modelChanged: Subject < string > = new Subject < string > ();

constructor()
this.modelChanged
  .debounceTime(500) //before emitting last event
  .distinctUntilChanged()
  .subscribe(model => this.newTitle = model);
}

rename(): void {
  this.renameRequest.emit(this.newTitle);
}

Answer 1

嗯，有很多方法可以实现这一点，但这是一种方式：

<input *ngIf="edit" type="text" #input="ngModel" [(ngModel)]="card.title" (ngModelChange)='rename()'/>

在课堂内

newTitle : string;
@ViewChild('input') input;
constructor()

}

ngAfterViewInit(){
       this.input.valueChanges
             .debounceTime(500) before emitting last event
             .distinctUntilChanged() 
             .subscribe(model => (value)=>{
                   console.log('delayed key press value',value);
                    this.rename(value)
              });

}

rename(value): void {
    this.renameRequest.emit(value);
}

以下是Plunker

您甚至可以订阅modelChange，如下：

ngAfterViewInit(){
       this.input.update // this is (modelChange)
             .debounceTime(500) before emitting last event
             .distinctUntilChanged() 
             .subscribe(model => (value)=>{
                   console.log('delayed key press value',value);
              });

}

去抖动以获得angular2的值输入

1 个答案: