1

I have CarsComponent that I multi time use ChartComponent in it's template as I mentioned in code snippet:

cars.component.html:

      <div class="row" *ngIf="selectedItemId">
        <div class="col-12 mb-2">
          <report-chart [LegendData]="xAxisData1"
                        [SeriesData]="yAxisData1"
                        title="میزان خروج وسیله ی نقلیه از مراکز تولید"
                        barChartColor="#ad106c"
                        (onReportClick)="getProductReport()">
          </report-chart>
        </div>
        <div class="col-12">
          <report-chart [LegendData]="xAxisData2"
                        [SeriesData]="yAxisData2"
                        barChartColor="#3398DB"
                        title="میزان ورود وسیله نقلیه به مراکز فروش"
                        (onReportClick)="getSaleReport()">
          </report-chart>
        </div>
      </div>

and and in my ChartComponent I use radio-button-group like this:

chart.component.html:

<nb-radio-group [(ngModel)]="selectedChart" class="d-flex justify-content-center">
  <nb-radio class="d-flex justify-content-center"
            *ngFor="let option of radioButtonsOptions"
            [value]="option.value">
    {{ option.label }}
  </nb-radio>
</nb-radio-group>

my problem is when report-chart load in cars-component selected radio button only show in one instance and I want to prevent affection of two instance to each other

enter image description here

amir wp
  • 21
  • 3

1 Answers1

0

If I understand correctly you want to enable the ratio buttons only in the second child component and not the first.

The solution would be to pass a boolean input in the child component to show or not the ratio button.

angularity13
  • 31
  • 3
  • thank you for answer as you see in picture when selected radio button show in one instance another instance not showing its selected radio button in other word i want to prevent affection of two instance to each other – amir wp Feb 17 '22 at 20:38
  • Can you explain, what you mean by prevent affection? – HassanMoin Feb 17 '22 at 20:43
  • @HassanMoin showing blue circle for selected radio button only display in one radio-group while these groups are in different instance of report-chart component – amir wp Feb 17 '22 at 20:52
  • in the attach image only one radio button is showing blue circle, do you want to hide the above radio button and only show blue circle radio button ? – HassanMoin Feb 17 '22 at 21:04
  • @HassanMoin see this link https://github.com/akveo/nebular/issues/1463 – amir wp Feb 17 '22 at 21:08