在Angular中保存动态用户输入有很多种方法,以下是其中一种解决方案的示例代码:
import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';
@Component({
selector: 'app-save-input',
templateUrl: './save-input.component.html',
})
export class SaveInputComponent implements OnInit {
inputForm: FormGroup;
constructor(private formBuilder: FormBuilder) {}
ngOnInit() {
this.inputForm = this.formBuilder.group({
userInput: '',
});
}
saveInput() {
const userInputValue = this.inputForm.get('userInput').value;
// 在这里将用户输入保存到数据库或其他地方
console.log(userInputValue);
}
}
上述示例代码中,我们使用了Angular的响应式表单(Reactive Form)来创建一个包含一个文本输入框和一个保存按钮的表单。在组件的saveInput()
方法中,我们通过this.inputForm.get('userInput').value
获取用户输入的值,并可以将其保存到数据库或其他地方。
请注意,为了使上述代码正常工作,需要在模块中导入ReactiveFormsModule
:
import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
imports: [
ReactiveFormsModule,
// 其他模块
],
// 组件声明、提供者等
})
export class AppModule { }
希望以上示例能帮助到你!