加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

Angular 2单选按钮无法使用反应形式正确初始化

发布时间:2020-12-17 17:08:30 所属栏目:安全 来源:网络整理
导读:我从Angular 2开始,目前正在使用2.2.2版本 我正在写一个反应形式,但我无法初始化所选的单选按钮.页面应加载选中的单选按钮,但这不会发生. 我一直无法找到问题的根源.从Web上的代码示例,我认为这应该是有效的.这是我的代码片段. form [formGroup]="consultaSo
我从Angular 2开始,目前正在使用2.2.2版本

我正在写一个反应形式,但我无法初始化所选的单选按钮.页面应加载选中的单选按钮,但这不会发生.

我一直无法找到问题的根源.从Web上的代码示例,我认为这应该是有效的.这是我的代码片段.

<form [formGroup]="consultaSolicitudesINETELForm"  (ngSubmit)="consulta(consultaSolicitudesINETELForm)">
<input type="radio" formControlName="criterio" value="1"  />
<input type="radio" formControlName="criterio" value="2"  />
<input type="radio" formControlName="criterio" value="3"  />
<input type="text" formControlName="folio" placeholder="folio" required>
 </form>

对于组件

import { Component,OnInit } from '@angular/core';
import { FormGroup,FormBuilder,Validators } from '@angular/forms';
@Component({
moduleId: module.id,selector: 'my',templateUrl: 'my.component.html',styleUrls: ['my.component.css']
})
export class My implements OnInit {

myForm: FormGroup;

constructor(private fb: FormBuilder) {

}

ngOnInit(): void {
  this.buildForm();
}

buildForm(): void {

  this.consultaSolicitudesINETELForm = this.fb.group({
    criterio: ["2"],folio: ["TEST"],});

  this.myForm.valueChanges.subscribe(data => this.onValueChanged(data));
  this.onValueChanged();

}

编辑:
?Here是一个plnkr我从一个示例分叉,我添加了无法在我的环境中运行的无线电.我看到的唯一区别是版本号.

EDIT2:
好的,我发现它与ng-bootstrap有关.如果我使用NgbModule.forRoot()然后单选按钮没有初始化并且没有按预期工作,如果我禁用ng-bootstrap然后它们工作,但因为我在其他地方使用ng-bootstrap我不能这样做.

我通过使用ng-bootstrap自己的单选按钮组并重新设计网页来解决它.我将单选按钮放在各种字段集的图例中,所有内容始终可见.
现在无线电工作类似于标签,根据当前选择显示不同的div.

单选按钮的原始选项是选择一个工作字段集,其中将启用其所有元素,并禁用所有其他字段集的内容.

解决方法

此问题与ng-bootstrap有关,并在 https://github.com/ng-bootstrap/ng-bootstrap/issues/1125处进行跟踪

这是他们的首要任务.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读