问题描述: 在不同组件中的Angular表单不起作用,无法进行数据绑定、验证和提交。
解决方法:
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
@NgModule({
imports: [
FormsModule, // 模板驱动表单
ReactiveFormsModule // 响应式表单
],
// ...
})
export class YourModule { }
// 父组件
@Component({
// ...
})
export class ParentComponent {
nameControl = new FormControl();
}
// 父组件的模板
// 子组件
@Component({
// ...
})
export class ChildComponent {
@Input() nameControl: FormControl;
}
// 表单服务
@Injectable()
export class FormService {
nameControl = new FormControl();
}
// 组件
@Component({
// ...
})
export class YourComponent {
constructor(private formService: FormService) { }
}
通过上述步骤,可以确保在不同组件中的Angular表单能够正常工作,并实现数据绑定、验证和提交。
上一篇:不同组件之间无法获取函数
下一篇:不同组内点到其他组最近邻点的距离