javascript - 如何在没有警告或ngModel的情况下制作下拉菜单?

标签 javascript angular angular-reactive-forms

你能告诉我如何在没有警告的情况下制作下拉菜单或 Angular ngModel 吗?我收到警告

enter image description here

代码

https://stackblitz.com/edit/angular-vsjbr9?file=src%2Fapp%2Fapp.component.ts

如果没有 ngModel,我将如何实现同样的目标

  <form novalidate [formGroup]="searchForm" class="calform">
      <section class="col-sm-6 bg-white  pl-20 pr-20">
        <div class="form-group col-sm-8 pl-0">
          <label class="field-title mb-5">Circle<span class="color-red fontWt">&nbsp;*</span></label>
          <div class="select width-170 mr-20">
            <select formControlName="circle"  [(ngModel)]="selectedCircle">
              <option class='option'
                      *ngFor='let o of circle'
                      [disabled]="o.value==''"
                      [value]="o.value">{{o.option}}</option>
            </select>
          </div>
        </div>
      </section>
    </form>

我希望默认情况下选择第一个选项,并且用户从不在我的示例中选择第一个选项(“从未选择列表中选择”)

最佳答案

是这样的吗? https://stackblitz.com/edit/angular-zxeysz?file=src%2Fapp%2Fapp.component.ts

我已经删除了 ngmodel。您已经在使用表单组,因此不需要 ngmodel。

然后在您的 ts 文件中,您确实创建了“圆圈”控件,但您分配了空值。我已将其更改为空字符串 ''。通过这种方式,可以使用 '' 值预先检查选择。

关于javascript - 如何在没有警告或ngModel的情况下制作下拉菜单?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51976359/

相关文章:

javascript - 如何使用ajax将新页面加载到div

javascript - Angular,将来自组件的输入注入(inject)我的标题

javascript - Angular 6 patchValue 更新了值,但在我提交时却没有更新?

angular - 将 formControlName 用于 react 形式的自定义输入组件

javascript - 如何将数组键索引映射到下拉列表表单控件中的其他键名称?

javascript - 如何将树转换为 JSON 对象?

javascript - 为多个页面上的导航栏创建可重用的 html

Angular 7 react 形式无法读取未定义的属性 'controls'

javascript - 提交时重置 div 内容

angular - 找不到 'AppModule' 的 NgModule 元数据