Question

这一直在推动我。我几乎使用了ngx-bootstrap手册中的示例：https://valor-software.com/ngx-bootstrap/#/buttons#radio-reactiveforms并且它不起作用。这是我的模板和组件：

模板：

<pre class="card card-block card-header">{{ myForm.value | json }}</pre>
<form [formGroup]="myForm" class="form-inline">
  <div class="form-group">
    <div class="btn-group" btnRadioGroup formControlName="radio">
      <label btnRadio="A" class="btn btn-primary">A</label>
      <label btnRadio="B" class="btn btn-primary">B</label>
      <label btnRadio="C" class="btn btn-primary">C</label>
    </div>
  </div>
</form>

组件：

import { Component, OnInit } from '@angular/core';
import { FormBuilder, FormGroup } from '@angular/forms';

@Component({
  selector: 'demo-buttons-radio-reactiveforms',
  templateUrl: './keyed-payment.component.html',
  styleUrls: ['./keyed-payment.component.scss']
})
export class KeyedPaymentComponent implements OnInit {
  myForm: FormGroup;

  constructor(private formBuilder: FormBuilder) {}

  ngOnInit() {
    this.myForm = this.formBuilder.group({
      radio: 'C'
    });
  }
}

此外，我还在app.module.ts中添加了以下内容：

import { FormsModule } from '@angular/forms';
import { ReactiveFormsModule } from '@angular/forms';

并在进口数组中：

imports: [
   ....
   FormsModule,
   ReactiveFormsModule,
   ....
],

这是我得到的错误：

错误错误：表单控件的值访问器没有名称：＆＃39; radio＆＃39; at _throwError（forms.js：2432） at setUpControl（forms.js：2302）在FormGroupDirective.addControl（forms.js：6658）在FormControlName._setUpControl（forms.js：7308）在FormControlName.ngOnChanges（forms.js：7221）在checkAndUpdateDirectiveInline（core.js：12365） at checkAndUpdateNodeInline（core.js：13893） at checkAndUpdateNode（core.js：13836）在debugCheckAndUpdateNode（core.js：14729）在debugCheckDirectivesFn（core.js：14670）

有什么想法吗？

Answer 1

我已经弄明白了。我所要做的就是将它添加到我顶部的app.module.ts：

import { ButtonsModule } from 'ngx-bootstrap';

这在我的进口中：

imports: [
    ....
    FormsModule,
    ReactiveFormsModule,
    ButtonsModule,
    ....
]

无法使ngx-bootstrap无线电工作，没有值访问器

1 个答案: