angularjs - 带有输入干扰枚举选择的 ngModel
问题描述
我的代码有问题。所以我正在尝试制作一个表单来接收用户的信息并将其添加到组件的属性中。为此,我使用 2 路绑定以及一些输入和选择。我的选择正在接收来自枚举的选项。问题是,当我在输入或选择中使用 ngModel 时,我的选择选项消失了。
<div class="container">
<div class="form">
<input type="text" placeholder="Brand" [(ngModel)]="newItem.brand" />
<input type="text" placeholder="Model" [(ngModel)]="newItem.model" />
<input type="text" placeholder="Price" [(ngModel)]="newItem.price" />
<textarea
placeholder="Description"
[(ngModel)]="newItem.description"
></textarea>
<select class="form-control" [(ngModel)]="newItem.genre">
<option value="" disabled selected>Gender</option>
<option *ngFor="let genre of genres.select()" value="{{ genre.key }}">
{{ genre.value }}
</option>
</select>
<select class="form-control" [(ngModel)]="newItem.notes">
<option value="" disabled selected>Notes</option>
<option *ngFor="let note of notes.select()" value="{{ note.key }}">
{{ note.value }}
</option>
</select>
<select class="form-control" [(ngModel)]="newItem.size">
<option value="" disabled selected>Size of bottle</option>
<option *ngFor="let size of sizes.select()" value="{{ size.key }}">
{{ size.value }}
</option>
</select>
<select class="form-control" [(ngModel)]="newItem.type">
<option value="" disabled selected>Type</option>
<option *ngFor="let type of types.select()" value="{{ type.key }}">
{{ type.value }}
</option>
</select>
<input
type="text"
placeholder="Img URL"
[(ngModel)]="newItem.image"
/>
</div>
<button class="btn">CREATE</button>
</div>
我真的不知道我做错了什么或另一种方式来做到这一点。如果你们能帮助我,那就太好了!
提前致谢
解决方案
推荐阅读
- shell - 如何解决 Parsing expression Lexer error yq
- python - 使用 FastAPI 在请求中注入附加参数
- javascript - 使用 .forEach 时出现异步/等待问题
- json - vscode json文件
- ruby-on-rails - 文件中的葡萄 Swagger 描述
- apache-kafka - 如何使两个DC之间的kafka集群中的生产者幂等?
- javascript - 提交表单并验证 TOKEN JWT 后,再次加载 Vue JS 实例
- c# - 查看新用户加入电报频道时使用的链接
- laravel - Laravel可邮寄,实现ShouldQueue时数据不会传递给Blade
- d3.js - 单击按钮切换数据集时无法更新图表