Я использую Materialise v0.97.7 с Angular и Typescript, который я заметил, когда я изменил направление на RTL и язык, чтобы изменить порядок индексации табуляции, все еще начиная слева направо. Я попытался использовать tabindex = "1 ", tabindex =" 2 "..... но это не работает. Так почему порядок табуляции не изменился на RTL и все еще начинается с слева направо, хотя вся страница изменена на RTL
HTML теги:
<form autocomplete="off" #createModal="ngForm" (ngSubmit)="save()">
<h1 mat-dialog-title>Create New </h1>
<mat-dialog-content style="width: 100%;height:100%;">
<mat-tab-group>
<mat-tab [label]="'GeneralInformation' | localize">
<div class="row" >
<div class="col-md-6" >
<mat-form-field appearance="standard" >
<mat-label>{{ "governorates" | localize }}</mat-label>
<mat-select required [(ngModel)]="selectedCity" tabindex="2"
placeholder='{{ "governorates" | localize }}'
name="governorate" id="governoratesSlct" (selectionChange)='fillMains($event.value)' >
<mat-option *ngFor="let governorate of listOfgovernorates" [value]="governorate.tenantId" >{{governorate.governorateName}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="col-md-6" >
<mat-form-field appearance="standard" >
<mat-label>{{ "Mains" | localize }}</mat-label>
<mat-select required tabindex="1"
placeholder="'Mains' | localize '"
name="mainProjec" id="mainSlct" #singleSelect [formControl]="mainCtrl" >
<mat-option>
<ngx-mat-select-search [formControl]="mainFilterCtrl" placeholderLabel="...ابحث عن المشروع ال" ></ngx-mat-select-search>
</mat-option>
<mat-option *ngFor="let main of filteredMains | async" [value]="main" >{{main.name}}</mat-option>
</mat-select>
</mat-form-field>
</div>
</div>
<div class="row">
<div class="col-md-4" >
<mat-form-field>
<mat-label>{{ "Status" | localize }}</mat-label>
<mat-select [(ngModel)]="sub.StatusId" required tabindex="5"
placeholder='{{ "Status" | localize }}'
name="Status" id="StatusSlct">
<mat-option *ngFor="let Staus of listOfStatuses" [value]="Staus.id" >{{Staus.StatusDescription}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="col-md-4" >
<mat-form-field>
<input tabindex="4"
matInput
name="subNumber"
[placeholder]="'subNumber' | localize"
[(ngModel)]="sub.subCode"
type="text"
required
minlength="2"
maxlength="255"
/>
</mat-form-field>
</div>
<div class="col-md-4" >
<mat-form-field >
<!-- <mat-label>{{ "Sub" | localize }}</mat-label> -->
<input
matInput tabindex="3"
name="subName"
[placeholder]="'subName' | localize"
[(ngModel)]="sub.subName"
type="text"
required
minlength="2"
maxlength="255"
/>
</mat-form-field>
</div>
</div>
</mat-tab>
</mat-tab-group>
</mat-dialog-content>
<div mat-dialog-actions align="end">
<button mat-button type="button" [disabled]="saving" (click)="close(false)">
{{ "Cancel" | localize }}
</button>
<button
mat-flat-button
type="submit"
flex="15"
color="primary"
[disabled]="!createModal.form.valid || saving">
Save
</button>
</div>
</form>