Question

我正在尝试查看是否可以订阅类型为observable的变量。当我将输入与[(ngModel)]绑定时，更改似乎不会触发。

代码：

@Component({
  selector: 'alert',
  template: '<input type="text" [(ngModel)]="test" />'
})

export class alertComponent {
  default:String: 'testValue';
  test = Observable.of(this.default).subscribe(x => {
    console.log(x); // only logs for first time
  });
}

Answer 1

RxJS 6及更高版本

import { of } from 'rxjs';

of("testValue").subscribe(x => {
  console.log(x)
})

引用Could not use Observable.of in RxJs 6 and Angular 6

Answer 2

Observable.of仅触发一次。这就是为什么它第一次为您工作的原因。

如果要触发某些操作，可以将其直接绑定到ngModelChange事件，而不是将其转换为可观察并订阅的事件？

您可能对此问题也很感兴趣 How can I make an input observable?

Answer 3

如果您希望将模型值作为可订阅项：

@Component({
  selector: 'alert',
  template: `
    <input type="text" 
        [(ngModel)]="myValue"
        (ngModelChange)="myValue$.next($event)"
        (blur)="touched$.next($event)"
/>
    `
})

export class alertComponent {
  default:String: 'testValue';
  myValue: string;
  myValue$ = new Subject<string>();
  touched$ = new Subject<any>();

}

我在blur事件上添加了处理程序，只是为了表明您可以在任何类型的事件上使用它。

对任何类型的事件进行操作的另一种方法是rxjs fromEvent方法。

万一您从未见过“ $”后缀：将其添加到任何可订阅的内容中是一种流行的命名约定。

订阅不可观察的Angular

3 个答案: