Question

使用更多代码编辑：

我只是尝试更新输入，然后提交表单。但是，当我通过服务器端代码获取表单时，它尚未更新。

<form id="cardsForm" method="post">
        <input id="jsonSearchCards" name="jsonSearchCards" type="text" value="{{cardsSQL}}">
    </form>
<a class="cardIcon" (click)="OpenDispatchView()" title="Testing"><span class="icon-file-text2"></span>

OpenDispatchView(): void {
    var url = 'Users/Cards';
    var dto = someJson;
    let jsonData = JSON.stringify(dto);

    this.cardsSQL = jsonData;

    $('#cardsForm').attr('action', GlobalVariables.SITE_ROOT + 'Users/Cards/').submit();

}

我认为这是因为角度没有填充值，但ng-reflect-value ??

Answer 1

好的，我想我现在明白了。试试这个：

//template
<form id="cardsForm" method="post">
        <input id="jsonSearchCards" name="jsonSearchCards" type="text" value="{{cardsSQL}}" #input>
</form>

//component
import { ViewChild } from '@angular/core';

@ViewChild('input') input;
OpenDispatchView(): void {
    var url = 'Users/Cards';
    var dto = someJson;
    let jsonData = JSON.stringify(dto);

    this.input.nativeElement.value = jsonData; //this should work

    $('#cardsForm').attr('action', GlobalVariables.SITE_ROOT + 'Users/Cards/').submit(); //but I don't know about this.

}

说实话，我觉得你不需要这个表格......

Answer 2

由于您正在使用表单，我会更改它并使其更加“angular-ish”。

<form #cardsForm="ngForm" (ngSubmit)="submitForm(cardsForm.value)">
   <input name="jsonSearchCards" type="text" value="{{cardsSQL}}" [(ngModel)]="cardsSQL">
</form>

当您提交表单时，您有一个很好的对象可以使用上述submitForm方法：

{
  "jsonSearchCards": "the value"
}

..您可以使用它来提交表单的http请求。

这应该可以正常工作，这是一个

的 demo plunker

希望这有帮助！

Angular2检查输入变化

2 个答案:

的 demo plunker