使用步进器 Angular4 时无法在控制器中获取文本框值

Question

<form #subleaseForm01="ngForm">
    <ng-template mdStepLabel>Fill out initial details</ng-template>
    {{diagnostic}}
    <md-grid-list cols="1" rowHeight="8:1">
        <md-grid-tile>
            <label for="title">Title</label>
            <md-form-field>
                <input mdInput type="text" id="title1" placeHolder="Title" class="form-control" required ngModel name="title" #name="ngModel">                TODO: remove this: {{model.title}}
            </md-form-field>
            <br>
            <div [hidden]="name.valid || name.pristine">
                Name is required
            </div>
        </md-grid-tile>
    </md-grid-list>
    <div>
        <button md-raised-button color="warn" mdStepperNext>Next</button>
    </div>
</form>

我想获取在标题字段中输入的值。我得到的只是未定义的。我正在使用 ngModel 标签来绑定变量。我写了一个 class 定义必填字段，并试图记录在提交当前值后创建的新 object。

Answer 1

您可以使用 [(ngModel)]="" 属性:

获取输入值

component.html:

<input mdInput type="text" id="title1" placeHolder="Title" class="form-control" required [(ngModel)]="title" name="title">

component.ts:

private title: string;

通过this.title访问它。

使用步进器 Angular4 时无法在控制器中获取文本框值

Unable to get textbox value in the controller when using stepper Angular4

data-binding

angular-material

angular

angular4-forms