Question

我已经建立了这样一个观察点：

this.source$ = this.store$
  .select(state => state.source);

在模板中：

<form>
    <div class="form-group">
        <input type="email" id="input-to" placeholder="To" [ngModel]="(source$ | async).customer" name="sender" class="input-transparent form-control">
    </div>
</form>

正如你所看到的，我试图＆＃34;绑定＆＃34; $source Observable表单输入字段。

目前，我收到此异常消息：

未捕获（承诺）：错误：./PaymentForm类中的错误PaymentForm - 内联模板：21：13导致：valUnwrapper.unwrap（...）为空

另一个问题。有人能告诉我如何将observable绑定到输入字段吗？我的意思是，我应该使用[ngModel]="(source$ | async)..."还是(ngModel)=...

Answer 1

ngModel仅用于双向绑定 .Its语法为[(ngModel)] 对于单向值绑定，使用[]从组件到html。尝试值：

 <input type="email" id="input-to" placeholder="To" [value]="(source$ | async).customer" name="sender" class="input-transparent form-control">

()用于从视图到组件的绑定（例如事件）。示例

<input type="email" id="input-to" placeholder="To" (onChange)="func()" name="sender" class="input-transparent form-control">

您可以ngModel使用[ngModel]="data" (ngModelChange)="event()

Angular2：将可观察量绑定到输入表单字段

1 个答案: