ngForm与ngControl无法正常工作

Question

我已经开始研究Angular2了，我在处理ngForm和ngControl方面遇到了问题。我正在尝试console.log从表单中获取的值，但在检查控制台时，该对象显示为空。 下面是TypeScript和HTML代码

import {
  Component,
  OnInit
} from '@angular/core';

@Component({
  selector: 'app-form',
  templateUrl: './form.component.html',
  styleUrls: ['./form.component.css']
})
export class FormComponent implements OnInit {
  onSubmit(f) {
    console.log(f.value);
  }
  constructor() {}

  ngOnInit() {}

}

<h1> Registeration Form </h1>
<form (ngSubmit)="onSubmit(f)" #f="ngForm">
  <div>
    <label for='mail'>Mail </label>
    <input ngControl="email" type='text' id='mail' required>
  </div>
  <div>
    <label for='password'>password </label>
    <input ngControl="password" type='text' id='password' required>
  </div>
  <div>
    <label for='confirm-password'>Confirm Password </label>
    <input ngControl="confirm-password" type='text' id='confirm-password' required>
  </div>
  <button type="submit"> Submit</button>
</form>

Answer 1

EmbeddedDatabaseBuilder builder = new EmbeddedDatabaseBuilder();
        EmbeddedDatabase db = builder
            .setType(EmbeddedDatabaseType.HSQL) //.H2 or .DERBY
            .addScript("db/sql/create-db.sql")
            .addScript("db/sql/insert-data.sql")
            .build();
        return db;