我正在做一个我正在使用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>
在组件.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 中的一个变量中。然后我将该变量推入数组平台。
你能帮我用更正确的方法来做到这一点吗?