我正在做一个有角的项目,其中我正在使用formbuilder。我需要两个输入选项。
1)选择
2)输入文字框
在选择输入中选择选项时,将显示文本框。
我在提交表单时发送数据时遇到问题。文本框中的值正在发送未定义,或者在选择多个情况下仅发送输入文本框。
如何发送两个值?
示例代码:-
在 component.html
中<div class="col">
<div class="form-group">
<label>Platform</label>
<select title="Select" formControlName="platform" class="form-control" multiple data-selected-text-format="count">
<option value="aws">aws</option>
<option value="azure">azure</option>
<option value="on-premise">on-premise</option>
<option (click)="handleCheck();">Other</option>
</select>
<input #item(keyup)="handleOther(item.value);" class="form-control" *ngIf="check" type="text">
</div>
</div>
在 component.ts
中check = false;
handleCheck() {
this.check = !this.check;
}
platformOther: string;
handleOther(item) {
this.platformOther = item;
}
getf() { return this.sampleForm.controls; }
onSubmit() {
if (this.platformOther) {
this.sampleForm.controls.platform.value.push(this.platformOther);
}
let value = this.f.platform.value.slice();
const index = value.indexOf("Other");
if (index !== -1) {
value.splice(index, 1);
}
this.toBe.platform = value.toString();
}
这正在工作。我所做的是创建了一个函数,并在输入文本框中的keyup事件中将该值保存在component.ts中的变量中。然后我将该变量推入数组平台。
您能以更正确的方式帮助我吗?