issue in 'json-editor' npm package while using in Angular getting error 'json-editor' is an unknown element

164 views Asked by At

I have already visited the link, but it does not clearly mention how to fix it. here

followed below step

  1. installed "jsoneditor": "^9.10.3" & "ang-jsoneditor": "^3.1.1".
  2. added NgJsonEditorModule to the 'imports' section of the app-module: - import { NgJsonEditorModule } from 'ang-jsoneditor/public_api';
  3. added below code in ts
public editorOptions: JsonEditorOptions;
 public data: any;
 @ViewChild(JsonEditorComponent) editor: JsonEditorComponent;

 constructor() {
   let editorOptions = new JsonEditorOptions();
   editorOptions.modes = ['code', 'text', 'tree', 'view']; // set all allowed modes
   editorOptions.name = 'root';
   editorOptions.schema = SCHEMA;
   // (editorOptions as any).autoComplete = {
   //   confirmKeys: [39, 35, 9],
   //   getOptions: (text: string, path: string[], input: string) => {
   //     return ['ASC','DESC'];
   //   }
   // };

   this.editorOptions = editorOptions;
   this.data = {
     Items: [
       {
         Name: 'A',
         NumberProperty: 123,
         BooleanProperty: true,
         StringProperty: 'abc',
         OrderBy: 'DESC'
       },
       {
         Name: 'B',
         NumberProperty: 456,
         BooleanProperty: false,
         StringProperty: 'def',
         OrderBy: 'ASC'
       }
     ]
   };
 } 

below code in HTML

<json-editor [options]="editorOptions" [data]="data"></json-editor>

Let me know if anything needs to add

0

There are 0 answers