我曾经在Ingangle2/4中使用过窗体构建器,但现在我在Ingangle6中使用它。我见过这个问题(不能绑定到“form group”,因为它不是“form”的已知属性),但它是针对angular 2的。我对角4做了同样的事情,但我得到了这个错误。请帮忙:我的代码是:
app.module.ts:(我已导出FormsModule和ReactiveFormsModule):
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { LocalStorage } from './services/localStorage.service';
import { HttpModule, RequestOptions, XHRBackend } from '@angular/http';
import { Router } from '@angular/router';
import { RouterModule } from '@angular/router';
import { AppComponent } from './app.component';
import { routing } from './app.route';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { LoginComponent } from './components/login/component';
import { ForgotComponent } from './components/forgotPassword/component';
@NgModule({
exports: [
FormsModule,
ReactiveFormsModule
],
declarations: [
AppComponent,LoginComponent,ForgotComponent
],
imports: [
BrowserModule,
routing,
],
providers: [
LocalStorage,
],
bootstrap: [AppComponent],
})
export class AppModule { }
login.component.ts:
import { Component, ViewContainerRef, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { FormBuilder, FormGroup, Validators, NgForm } from '@angular/forms';
import { LocalStorage } from '../../services/localStorage.service';
import { environment } from '../../../environments/environment';
import { HttpService } from '../../services/http.service';
import { emailRegexp, passwordRegexp } from '../../constants';
@Component({
selector: 'login-app',
templateUrl: './login.component.html',
styleUrls: ['./login.component.scss']
})
/**
* LoginComponent class
*/
export class LoginComponent {
private loginForm: any;
loginValue:any;
constructor(
private formBuilder: FormBuilder,
private _router: Router,
private httpService: HttpService,
private localStorage: LocalStorage,
) {
this.loginValue = new LocalStorage(environment.localStorageKeys.ADMIN).value;
this.loginForm = this.formBuilder.group({
email: ['', Validators.compose([Validators.required, Validators.pattern(emailRegexp)])],
password: ['', Validators.compose([Validators.required, Validators.minLength(8)])]
});
}
}
<form [formGroup]="loginForm" (ngSubmit)="loginForm.valid && login()" novalidate>
<input type="email" autocomplete="off" (focus)="focusFunction()" placeholder="User Name" formControlName="email" class="form-control">
<div class="col-12">
<input autocomplete="off" type="password" (focus)="focusFunction()" placeholder="Password" formControlName="password" class="form-control">
</div>
<button [disabled]="!loginForm.valid" type="submit" class="btn btn-inverse btn-rounded btn-block">
<div *ngIf="!loading" class="sign-in">Sign in</div>
</button>
</form>
在app.module.ts
中添加以下代码:
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
和imports数组中:
imports: [
BrowserModule,
FormsModule,
ReactiveFormsModule
]
formgroup
是formgroupdirective
指令的选择器,该指令主要用于将现有的formgroupdirective
绑定到DOM元素,并且reactiveformsmodule
模块中有formgroupdirective
。
(为简洁起见进行了简化) modal-dialog.html modal-body.html(使用angular2-component-outlet的动态模板)
下面是我模块中的代码
我想在离子页面上做一个表单,但我有那个错误。图像误差 我一直在搜索这个问题,更流行的解决方案是导入ReactiveFormsModule,但正如您所看到的,它是正确导入的。怎么会有问题呢? 表单位于一个页面(editpage)中,该页面作为模式从tab2页面启动。
我在angular 2是新的,我试图做一个反应形式,但我有一些麻烦。在堆栈中找了很多遍后,我没有找到解决方案。 在这里你可以看到我的错误 代码: 希望这个答案能帮助别人。
还有我遗忘的.password.html 认证模块
我使用Angular ReactiveFormsModule创建了一个表单,但在构建应用程序时得到了这个错误消息 src/app/security/login/login.component.html中的错误:11:13-错误NG8002:无法绑定到“窗体组”,因为它不是“窗体”的已知属性。 html: login.component.ts security.module.ts