enableRtl 속성을 true로 설정하려는 버튼을 클릭하여 ag-grid 구성 요소를 만들었습니다.
간단히 말해 하나의 구성 요소를 추가했습니다.
<ag-grid-angular #agGrid [floatingFilter]="true"
[enableRtl]="isArabic" (gridReady)="onGridReady($event)"
[(enableRtl)]="enableRtl"
[rowSelection]="rowSelection"
[defaultColDef]="columnConfig" [rowData]="data"
[columnDefs]="columns"
[gridOptions]="gridOptions"
></ag-grid-angular>
이제 클릭 이벤트를 기반으로 enableRtl을 변경하고 싶습니다.
여기서 enableRtl은 구성 요소의 공용 변수입니다.
그러나 그것은 RTL을 반영하지 않습니다.
Stackblitz에 시나리오를 추가했습니다.
https://stackblitz.com/edit/angular-ag-grid-col-span-and-col-group-tsso85
이를 달성 할 수있는 방법이 있습니다.
에 대한 플래그를 가지고 ngIf
상기 ag-grid-angular
이벤트 핸들러 내부 요소 수준 및 조건부 전환을.
<ag-grid-angular *ngIf="showGrid"
class="ag-theme-material"
[rowData]="rowData"
[columnDefs]="columnDefs | async"
[gridOptions]="gridOptions"
[enableRtl]="lang"
>
</ag-grid-angular>
이렇게하면 그리드가 업데이트 된 플래그로 다시 초기화됩니다.
그리드가 다시 초기화 될 때 여기에 성능 비용이 포함된다는 점을 명심하십시오. 그 영향이 미미하다고 생각하는 것은 당신에게 달려 있습니다. 이것이 당신을위한 해결책입니다.
업데이트 된 Stackblitz를 살펴보세요 : ag-grid : RTL <-> LTR
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다