angular - btn-group - btnRadio 初始值由枚举完成，不激活按钮

Question

我有以下 btn 组:

<div class="btn-group">
      <label class="btn btn-primary" [(ngModel)]="type" btnRadio="{{myType.A}}" name="A" ngDefaultControl>A</label>
      <label class="btn btn-primary" [(ngModel)]="type" btnRadio="{{myType.B}}" name="B" ngDefaultControl>B</label>
</div>

MyType 是一个枚举:

export enum MyType {
    A, B
}

这是组件:

@Component({
  selector: 'add-record',
  templateUrl: './add-record.component.html',
  styleUrls: ['./add-record.component.css']
})
export class AddRecordComponent implements OnInit {

  type: MyType;
  myType = MyType;

  constructor() { }

  ngOnInit() {
    this.type = MyType.A;
  }
}

如您所见，类型的初始值为 MyType.A 所以我希望第一个按钮处于事件状态，但事实并非如此。

我希望:

我有:

Answer 1

您必须将“事件”类添加到其中一个标签:

<div class="btn-group">
    <label class="btn btn-primary" [(ngModel)]="type" [class.active]="type=myType.A" btnRadio="{{myType.A}}" name="A" ngDefaultControl>A</label>
    <label class="btn btn-primary" [(ngModel)]="type" [class.active]="type=myType.B" btnRadio="{{myType.B}}" name="B" ngDefaultControl>B</label>
 </div>