angular - 面临 NgModel 的问题和无线电输入的 [检查]
问题描述
所以我正在提交一个角度表单,并且我提供了一个向用户更新数据的选项,但是当输入字段与 ngModel 绑定时,我无法根据条件预先检查单选按钮,我'我绝对是角度的初学者,所以任何帮助将不胜感激
app.component.html
<form #office="ngForm">
<div class="form-group pointer">
<label for="Shift" class="font-weight-bold fs-6">Tansport <span class="text-danger">*</span></label><br>
<div class="form-check form-check-inline">
<input class="form-check-input pointer" [checked]="editableData.transport.indexOf('cab') > -1" type="radio" ngModel name="transport" id="transport-1" value="cab">
<label class="form-check-label" for="transport-1">Cab</label>
</div>
<div class="form-check form-check-inline">
<input class="form-check-input pointer" [checked]="editableData.transport.indexOf('own') > -1" type="radio" ngModel name="transport" id="transport-2" value="own">
<label class="form-check-label" for="transport-2" >Own</label>
</div>
</div>
</form>
需要根据条件选中其中一个复选框
解决方案
我在这里修复了它:- https://stackblitz.com/edit/angular-ivy-vb5eeh?file=src%2Fapp%2Fapp.component.html
将它与类中的对象绑定。
推荐阅读
- sql-server - 从 sql 修改 SSIS 目录中的连接管理器信息
- c# - 将 int 添加到范围对象
- javascript - 函数参数内的括号 ES5 兼容性
- loops - 替换具有初始值的变量
- javascript - 如何在没有asp.net的xampp中在客户端检索当前Windows用户名
- android-studio - 侧面板(属性)未正确显示(Android Studio)
- reactjs - 如何关闭 eslint?
- python - 如何使用 Django 设置 JupyterHub?
- php - Laravel Excel 3.1:导入、修改、下载
- azure - Azure 事件中心:资源指标中的未知传出消息