我对Angular 2表单有什么错

我试图用angular 2创建简单的反应形式

这是我的app.module.ts

import {NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import {AppComponent} from './app.component';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';

@NgModule({
  imports: [ 
    BrowserModule, 
    FormsModule, 
    ReactiveFormsModule 
  ],
  declarations: [ AppComponent ],
  bootstrap: [ AppComponent ]
})
export class AppModule {}

这是我的app.component.ts

import { Component, VERSION, OnInit } from '@angular/core';
import { FormControl, FormGroup, FormBuilder } from '@angular/forms'

@Component({
  selector: 'my-app',
  template: `
    <form [formGroup]="loginForm" (submit)="submit($event)">
      <div>
        <label>login</label>
        <input formControllName="login" type="text">
      </div>

      <div>
        <label>password</label>
        <input formControllName="password" type="text">
      </div>

      <button type="submit" class="btn btn-primary">Submit</button>
    </form>

    <p>{{ loginForm.value | json }}</p>
  `,
})
export class AppComponent implements OnInit {
  public loginForm: FormGroup;

  constructor(private _fb: FormBuilder) { }

  ngOnInit() {
    this.loginForm = this._fb.group({
      login: [""],
      password: [""]
    })
  }

  submit(e) {
    e.preventDefault()
    console.log(this.loginForm.value)
  }
}

从'@angular/core'导入{Component，VERSION，OnInit}；
从“@angular/forms”导入{FormControl，FormGroup，FormBuilder}
@组成部分({
选择器：“我的应用程序”，
模板：`
登录
密码
提交
{{loginForm.value | json}

`,
})
导出类AppComponent实现OnInit{
公共登录信息：FormGroup；
构造函数（私有_fb:FormBuilder）{}
恩戈尼尼特（）{
this.loginForm=this.\u fb.group({
登录：[“”]，
密码：[“”]
})
}
提交（e）{
e、 预防默认值（）
console.log（this.loginForm.value）
}
}

当我填写输入并单击“提交”时，loginForm值仍然是初始值。此外，当我填充输入时，它不会改变。 这个例子非常简单，但不起作用。我做错了什么

---

这里是指向plunker的链接

您拼错了

FormControlName

-extra

l

请不要只指出排版问题或缺少字符就发布答案。这些答案不太可能对未来的访客有所帮助，因为它们是OP的代码所特有的。我很抱歉，我没有看到打字错误，花了几个小时来检查各种选项和理论。我绝望了。