NS7 : RadDataForm crash ios without errors

[niko01360]

Hi

I have a problem on IOS when I want to display a RadDataForm. The application crashes every time ... Even with the basic example in the documentation, i have the same problem. When I am in debug mode I don't see any errors but the application crashes on every RadDataForm I run.

"dependencies": {
    "@angular/animations": "~10.0.0",
    "@angular/cdk": "^10.2.0",
    "@angular/common": "~10.0.0",
    "@angular/compiler": "~10.0.0",
    "@angular/core": "~10.0.0",
    "@angular/flex-layout": "^10.0.0-beta.32",
    "@angular/forms": "~10.0.0",
    "@angular/material": "^10.2.0",
    "@angular/material-moment-adapter": "^10.2.4",
    "@angular/platform-browser": "~10.0.0",
    "@angular/platform-browser-dynamic": "~10.0.0",
    "@angular/router": "^10.0.14",
    "@nativescript-community/ui-material-bottomsheet": "^5.1.4",
    "@nativescript/angular": "~10.0.0",
    "@nativescript/background-http": "~5.0.0",
    "@nativescript/core": "^7.0.13",
    "@nativescript/schematics": "^10.1.0",
    "@nativescript/theme": "~2.2.1",
    "@nstudio/nativescript-checkbox": "^2.0.4",
    "@nstudio/nativescript-floatingactionbutton": "^3.0.3",
    "@sweetalert2/ngx-sweetalert2": "^8.1.1",
    "angular-calendar": "^0.28.20",
    "core-js": "^2.6.9",
    "crypto-js": "3.1.9-1",
    "date-fns": "^2.16.1",
    "jwt-decode": "^3.0.0-beta.2",
    "moment": "^2.29.1",
    "nativescript-advanced-permissions": "^1.2.0",
    "nativescript-mediafilepicker": "^4.0.1",
    "nativescript-secure-storage": "^2.6.2",
    "nativescript-toasts": "^1.0.3",
    "nativescript-ui-autocomplete": "^7.0.2",
    "nativescript-ui-calendar": "^7.0.2",
    "nativescript-ui-dataform": "^7.0.2",
    "nativescript-ui-listview": "^9.0.4",
    "nativescript-ui-sidedrawer": "^9.0.3",
    "ngx-material-file-input": "^2.1.1",
    "ngx-moment": "^5.0.0",
    "reflect-metadata": "~0.1.12",
    "rxjs": "~6.5.5",
    "sweetalert2": "^10.3.7",
    "tslib": "1.10.0",
    "zone.js": "~0.10.2"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "~0.1000.2",
    "@angular/cli": "~10.0.0",
    "@angular/compiler-cli": "~10.0.0",
    "@fortawesome/fontawesome-free": "^5.15.0",
    "@nativescript/android": "7.0.0",
    "@nativescript/tslint-rules": "~0.0.5",
    "@nativescript/webpack": "3.0.0",
    "@types/jasmine": "~3.5.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.12.58",
    "codelyzer": "^5.1.2",
    "jasmine-core": "~3.5.0",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~4.4.1",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~2.1.0",
    "karma-jasmine": "~3.0.1",
    "karma-jasmine-html-reporter": "^1.4.2",
    "node-sass": "^4.7.1",
    "protractor": "~5.4.3",
    "ts-node": "~8.3.0",
    "tslint": "~6.1.0",
    "typescript": "~3.9.0"
  }

Here is my tns.html :

<RadDataForm #form [source]="dossier" (propertyValidated)="onPropertyValidated($event)" commitMode="Manual" row="0" commitMode="OnLostFocus">
	<TKEntityProperty tkDataFormProperty name="label" displayName="Nom" index="0">
		<TKNonEmptyValidator tkEntityPropertyValidators errorMessage="Le nom ne peut pas être vide."></TKNonEmptyValidator>
	</TKEntityProperty>
	<TKEntityProperty #type tkDataFormProperty name="typeSpecific" displayName="Type" index="1" [valuesProvider]="types">
		<TKPropertyEditor tkEntityPropertyEditor type="Picker"></TKPropertyEditor>
	</TKEntityProperty>
	<TKEntityProperty hidden="true" tkDataFormProperty name="dateLimit" displayName="Date limite" index="2">
		<TKPropertyEditor tkEntityPropertyEditor type="DatePicker"></TKPropertyEditor>
	</TKEntityProperty>
</RadDataForm>

And my tns.ts :

import {ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
import {MatDialogRef, MAT_DIALOG_DATA} from '@angular/material/dialog';
import {Dossier, TYPES} from '@src/app/affair/dossier.model';
import {FormControl, FormGroup} from '@angular/forms';
import {ApiService} from '@src/app/services/api.service';
import {ToastService} from '@src/app/services/toast.service';
import {MatRadioChange} from '@angular/material/radio';
import * as moment from 'moment';

@Component({
  selector: 'app-modal-dossier',
  templateUrl: 'modal-dossier.component.html',
})
export class ModalDossierComponent implements OnInit {

  isSaving: boolean;
  dossierForm: FormGroup;
  types = TYPES;

  constructor(
    public dialogRef: MatDialogRef<ModalDossierComponent>,
    @Inject(MAT_DIALOG_DATA) public dossier: Dossier,
    private apiService: ApiService,
    private toastService: ToastService,
    private cdRef: ChangeDetectorRef,
  ) {}

  ngOnInit(): void {
    this.isSaving = false;
    this.dossierForm = new FormGroup({
      label: new FormControl(this.dossier.label),
      type: new FormControl(this.dossier.typeSpecific),
      state: new FormControl(this.dossier.state),
      dateLimit: new FormControl(this.dossier.dateLimit),
    });
    this.cdRef.detectChanges();
  }

  onChangeType(event: MatRadioChange): void {
    this.cdRef.detectChanges();
    this.dossierForm.updateValueAndValidity();
  }
}

And finally my model :

import {DocumentHistorique} from '@src/app/affair/document-historique.model';
import {Society} from '@src/app/annuaire/society/society.model';
import {Affair} from '@src/app/affair/affair.model';

export class Dossier {
    id: number;
    label: string;
    description: string;
    typeSpecific: any;
    step: {
        id: number;
        label?: string;
    };
    affair: Affair;
    dateLimit: string;
    state: number;
    documentHistoriques: DocumentHistorique[];
    societies: Society[];
    dossiers: Dossier[];
    nbDocuments: number;
    nbNotifications: {
        new?: number;
        update?: number;
        total: number;
    };
    nbDiscutions: number;
    isChargeAffair?: boolean;
    parentDossiers: [{
        id: number;
        label?: string;
    }];
    parentId?: number;
    allowTo: {
        diffuse: boolean,
        view_diffuse_date: boolean,
        diffuse_nb: boolean,
        valide_ca: boolean,
        valide_user: boolean,
        valide_user_btn: boolean,
        valide_user_date: boolean,
        societies: boolean,
        document: boolean,
        edit: boolean,
    };
    specificResponse: number;
    specificResponded: number;
    specificCAResponded: number;
    caResponse: number;
    dateSpecificResponded: string;
    dateSpecificCAResponded: string;
    validatedResponses: number;
    nbSolicitedSocities: number;
    diffuseDate: string;
    isSpecificDossier: boolean;

    constructor(
      label?: string,
      typeSpecific?: any,
      state?: number,
      dateLimit?: string,
    ) {
        this.label = label || '';
        this.typeSpecific = typeSpecific || '';
        this.state = state || 0;
        this.dateLimit = dateLimit || '';
    }
}