角2+与脱附
角2+与脱附
提问于 2015-08-17 13:09:01
在AngularJS中，我能够通过使用ng模型选项来破除模型。
ng-model-options="{ debounce: 1000 }"我怎样才能从角度上揭穿模型呢？
我试着在文档里搜索，但什么也找不到。
https://angular.io/search/#stq=debounce&stp=1
一个解决方案是编写我自己的退出函数，例如：
import {Component, Template, bootstrap} from 'angular2/angular2';
// Annotation section
@Component({
selector: 'my-app'
})
@Template({
url: 'app.html'
})
// Component controller
class MyAppComponent {
constructor() {
this.firstName = 'Name';
}
changed($event, el){
console.log("changes", this.name, el.value);
this.name = el.value;
}
firstNameChanged($event, first){
if (this.timeoutId) window.clearTimeout(this.timeoutID);
this.timeoutID = window.setTimeout(() => {
this.firstName = first.value;
}, 250)
}
}
bootstrap(MyAppComponent);和我的html
<input type=text [value]="firstName" #first (keyup)="firstNameChanged($event, first)">但是我在找一个内置的函数，有角的吗？
Stack Overflow用户
发布于 2016-11-24 03:32:20
如果您不想处理@angular/forms，可以只使用带有更改绑定的RxJS Subject。
view.component.html
<input [ngModel]='model' (ngModelChange)='changed($event)' />view.component.ts
import { Subject } from 'rxjs';
import { Component } from '@angular/core';
import 'rxjs/add/operator/debounceTime';
export class ViewComponent {
model: string;
modelChanged: Subject<string> = new Subject<string>();
constructor() {
this.modelChanged
.debounceTime(300) // wait 300ms after the last event before emitting last event
.distinctUntilChanged() // only emit if value is different from previous value
.subscribe(model => this.model = model);
}
changed(text: string) {
this.modelChanged.next(text);
}
}这确实会触发更改检测。要获得一种不会触发更改检测的方法，请查看Mark的答案。
更新
rxjs 6需要.pipe(debounceTime(300), distinctUntilChanged())。
示例：
constructor() {
this.modelChanged.pipe(
debounceTime(300),
distinctUntilChanged())
.subscribe(model => this.model = model);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/32051273
复制相关文章
相似问题
腾讯云开发者
