Question

因此，我试图将表单中的输入存储到属性中，但是当我提交console.log时，控制台本身会返回undefined。

这些是我尝试过但没有用的变体

// _custom.scss

@import "bootstrap/functions";
@import "bootstrap/variables";
$sizes: map-merge((20: 20%, 33: 33.33%, 40: 40%, 60: 60%, 67: 66.67%, 80: 80%), $sizes);
@import "bootstrap";

// Your CSS

这是打字稿的一部分

<form>
<input #in1 type="text" id="username" placeholder="username" value="5">
<input type="password"  id="password" placeholder="password">
<input type="submit" (click)="onSubmit(in1.value)" id="submit" placeholder="submit">
</form>









<form #myForm="ngForm">
        <div class="form-group">
          <label for="exampleInputEmail1">Email address</label>
          <input type="email" id="Log-email" ngControl="Email" ([ngModel])="SUsername.Email"  aria-describedby="emailHelp" placeholder="Enter email">
          <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small>
        </div>
        <div class="form-group">
          <label for="exampleInputPassword1" >Password</label>
          <input type="password" id="Log-pass" ngControl="pass" [(ngModel)]="SPassword.pass">
        </div>

        <button type="submit" class="btn btn-primary">Submit</button>
        <input type="button" (click)="test()" value="test">
      </form>

}

Answer 1

SUsername和SPassword应该初始化为对象

SUsername = {Email: ''}
SPassword= {pass: ''}

Answer 2

我将这样做：

<div class="col-md-10">
    @Html.DropDownList("CodeID", null, htmlAttributes: new { @class = "form-control" })
    @Html.ValidationMessageFor(model => model.CodeID, "", new { @class = "text-danger" })
</div>

编辑：

带有private model : any = { Email: "", pass : "" };和(ngSubmit)="onSubmit()"（以前是已经[(ngModel)]）
已删除([ngModel])

HTML代码：

<input type="button" (click)="test()" value="test">

确定：

您写的是<form #myForm="ngForm" (ngSubmit)="onSubmit()"> <div class="form-group"> <label for="exampleInputEmail1">Email address</label> <input type="email" id="Log-email" ngControl="Email" [(ngModel)]="model.Email" name="Email" aria-describedby="emailHelp" placeholder="Enter email"> <small id="emailHelp" class="form-text text-muted">We'll never share your email with anyone else.</small> </div> <div class="form-group"> <label for="exampleInputPassword1" >Password</label> <input type="password" id="Log-pass" name="Email" ngControl="pass" [(ngModel)]="model.pass"> </div> <button type="submit" class="btn btn-primary">Submit</button> </form>而不是[(ngModel)]

带有您的代码示例的working demo：）

Answer 3

您需要具有与（[ngModel]）=“ SUsername.Email”

相同的Html标签元素的名称属性。

我无法从输入中获取值来存储在app.component.ts中

3 个答案: