Я пытаюсь сделать красивее строку в моей текстовой области в angular, извлеченную из базы данных. Это объект, который я отправляю как строку и сохраняю в своей базе данных. Я представил ang-jsoneditor, но мне нужно проверить его, если, например, в ключе отсутствуют кавычки. Раньше у меня была текстовая область, и проверка была очень простой с использованием validatorFn из angular.
. У меня есть следующее:
в моем html:
<form fxLayout="column" [formGroup]="configForm">
<div fxFlex="1 0 auto" fxLayout="column">
<mat-form-field appearance="outline" fxFlex="100">
<mat-label>JSON File</mat-label>
<textarea matInput type="text" placeholder="Compose the json file here" formControlName="appConfig"
rows="15"></textarea>
<mat-error>
A valid JSON object is required.
</mat-error>
</mat-form-field>
</div>
</form>
и это то, что у меня есть в моем .ts
ngOnInit() {
this.configForm = this.formBuilder.group({
appConfig: ["", [Validators.required, this.isValidJSON]]
});
this.appManagementService.getDeviceAppConfig(this.deviceId).then(response => {
this.configErrorMessage = null;
this.lastUpdate = response.lastUpdate;
this.configForm.setValue({ appConfig: JSON.parse(response.config) });
}).catch(() => {
this.configErrorMessage = "Oops, could not get the registry info.";
});
}
private isValidJSON: ValidatorFn = (control: AbstractControl): ValidationErrors | null => {
if (!control.parent || !control) {
return null;
}
const appConfig = control.parent.get("appConfig").value;
console.log('appConfig', appConfig)
try {
JSON.parse(appConfig.toString());
return null;
} catch (error) {
return { "jsonInvalid": true };
}
}
, когда я передаю JSON .parse, то, что появляется в моей текстовой области, - [объектный объект]. Как я могу сделать это исправить ??