使用MAT-RADIO组的嵌套无线电按钮在角度

Question

我试图用嵌套的JSON数组显示嵌套的广播按钮。但是它无法正常工作。

 <mat-radio-group aria-label="Select an option" formControlName="investmentCategory" fxLayout="column">                                        
                                    <mat-radio-button   *ngFor="let category of investmentCategory" [value]="category.Investment_Category"
                                        [matTooltip]="">{{category.Investment_Category}}                                                                                       
                                            <mat-radio-group *ngIf="showSubCategory " aria-label="Select an option" formControlName="subInvestmentCat" fxLayout="column">                                        
                                                <mat-radio-button  [checked]="false" *ngFor="let subCat of category.Sub_Category" [value]="subCat.Sub_Category"
                                                    [matTooltip]="">{{subCat.Sub_Category}}                                                    
                                                </mat-radio-button>    
                                            </mat-radio-group>                                              
                                    </mat-radio-button>
                                   
                                </mat-radio-group>

输出越来越多。

有人可以帮我。提前致谢。

Answer 1

您可以通过将子组放置在内部的按钮外部，可以避免此问题：

<mat-radio-group aria-label="Select an option" formControlName="investmentCategory" fxLayout="column">

    <mat-radio-button   *ngFor="let category of investmentCategory" [value]="category.Investment_Category" [matTooltip]="">
        {{category.Investment_Category}}                                                                                       
    </mat-radio-button>

    <mat-radio-group *ngIf="showSubCategory " aria-label="Select an option" formControlName="subInvestmentCat" fxLayout="column">                                        

        <mat-radio-button  [checked]="false" *ngFor="let subCat of category.Sub_Category" [value]="subCat.Sub_Category" [matTooltip]="">
            {{subCat.Sub_Category}}                                                    
        </mat-radio-button>    

    </mat-radio-group>

</mat-radio-group>