mariohmol/ang-jsoneditor

Angular Jsoneditor that works with angular 4 to angular 15

ang-jsoneditor's Issues

Can we bind [(ngModel)] to JsonEditor ?

In this editor in order to get the changed data in editor we are using onChange method detection. Instead, Can we use angular's [(ngModel)] (Two way binding ) so that we will not need to hit onChange method.

Following is my code with the OnChange method in component.ts file:
`
public editorOptions: JsonEditorOptions;
@ViewChild(JsonEditorComponent) editor: JsonEditorComponent;

constructor() {
 this.editorOptions = new JsonEditorOptions();
}

ngOnInit() {
 this.editorOptions.onChange = () => {
  this.change();
};

change(): void {
   console.log(this.editor.getText());  
}

Inside the template we are using as follows :
"<div class="jsoneditor-wrapper" [ngClass]="cssClass">
<json-editor
[options]="editorOptions"
[data]="data">
"

The issue is getting occurred very first time without making any change to editor, we are going to fetch the data which already has JSON object, but because change event is not detected by the jsoneditor it is giving me undefined value while doing editor.getText() method. For this reason it will be great if we use Angular's Two way binding approach.

edit readme.md

import { NgJsonEditorModule } from 'angular-jsoneditor'

"angular-jsoneditor" but need "ang-jsoneditor"

How to work with Reactive Form?

Hi, Can we make this work with Reactive Form? I need to use with "formControlName"?

Thanks

Is there any way to update JSON progarammatically?

I can't update JSON data. On each new value, it reinitializes.
I noticed that JS lib has a method update.
Are you going to support this function?

Internet Explorer

Yes, I know, but still... Do you support IE 11?

JS lib said

Supported browsers: Chrome, Firefox, Safari, Opera, Edge, Internet Explorer 11.

I tried to run a demo in IE and it fails with an error.

When I add NgJsonEditorModule in app-module.ts my application fails in IE with error:

const BG_TRANSP = url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='2' height='2'%3E%3Cpath d='M1,0H0V1H2V2H1' fill='lightgrey'/%3E%3C/svg%3E");

In other browsers, it runs fine.

Can you help me with this?

Unable to use the component

Got below error when followed the directions to import in angular 5

ERROR in ./node_modules/ang-jsoneditor/esm5/ang-jsoneditor.js
Module not found: Error: Can't resolve 'jsoneditor' in '/Users/syerrawa/Workspace/cisco-components/node_modules/ang-jsoneditor/esm5'
resolve 'jsoneditor' in '/Users/syerrawa/Workspace/cisco-components/node_modules/ang-jsoneditor/esm5'
Parsed request is a module

Gives empty json in 'code' mode if we have more than one editor in same page

When we have more than one editor on the same page, the value fetched for all except the first one is empty.

Add unit-test example

Hi,

Perhaps adding a unit-test example would be very nice as well!

Not able to update json if there are multiple JSONeditor

How to change height of ang-jsonedior

@mariohmol HI.. I am using ang-jsoneditor along with angular 5. here now everything works perfectly but i wanted to change the height for my editor which I am opening in code mode. Can anybody have solution for it ?

How can we integrate XML reading in addition to JSON?

Hello , i want to read JSON data and XML data .
Can we parse the XML so that it is readable in JSON editor?
thank you

Editor loses focus if data is changed and displayed

I would like to reflect changes on the fly (e.g. as soon as the user changes something). But every time I change something in the code or the tree view, the jsoneditor loses focus. This issue can be replicated in the sample code by adding this.data = JSON.parse(this.editor.getText()) in the change-callback.

I suspect this happens because Angular re-renders the view and destroys the jsoneditor in that process. But would there be any way to work around this?

Edit (after further investigation): Its far more then the editing state that is lost on changes. The previously selected mode is lost as well and the current expansion state is lost as well. It seems that the editor is resetted entirely .

Add binding onChange in html

Would it be possible to bind onChange on a component rather than the options? i.e. do the following:

<json-editor [options]="options" [data]="data" (change)="onChange($event)"></json-editor>

Because in my case I have a list of objects in which I want to edit for each a property as json, but the current way to bind events makes this very difficult. Actually the best would be to support [(ngModel)] like any other form control

Is this possible to add drop-down inside this editor?

Let's say you want to force "primary_color" to be one of the colors in the colours array. How to tell JSON Editor that we want to use this field to populate a dropdown..

onCreateMenu

Hi,

I need your help in implementing "OnCreateMenu".
it seems "OnCreateMenu" option is not available in ang-jsoneditor, so i need your help in implementing it by my self.
where should i begin?

Use searchbox programmatically

Is it possible to update the SearchBox for tree/view via code?

josdejong/jsoneditor#364

Editor is giving me undefined on the onchange callback

this.editor is giving undefined in the on change function but the same thing is working in the ngAfterViewInit(). I guess the this.editor in change() is referring inside the jsonEditor rather than current component. Below is my code

Component

  public editorOptions: JsonEditorOptions;
  public data: any;

  @ViewChild(JsonEditorComponent) editor: JsonEditorComponent;
  template : {};
  
 ngOnInit() {
      this.template = {
      "forecast_date": {
        "label": "Forcast Date",
        "type": "date"
      }};
     this.editorOptions = new JsonEditorOptions();
    this.editorOptions.onChange= this.change;
  
    this.editorOptions.modes = ['code', 'text', 'tree', 'view']; // set all allowed modes
  }

  change() {
    console.log("change:"+this.editor);//**this.editor is giving undefined**
   }

  ngAfterViewInit() {
    console.log("ngviewiniti : "+ this.editor.getText());//The values is coming here 
   }

Template

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

Getting data from separate editors on the same page.

I have a page where I am using two JSON editors at the same time, but I want to be able to use editor.get() to get data from editor 1 and editor 2 respectively. Is there a way to do this in angular 5?

Can't use sortObjectKeys option

When setting the option sortObjectKeys to true, an error is always thrown and the editor never loads.

ERROR TypeError: Cannot read property 'findNodeByInternalPath' of null
    at JSONEditor.push../node_modules/jsoneditor/src/js/treemode.js.treemode._onChange (treemode.js:475)
    at JSONEditor.push../node_modules/jsoneditor/src/js/treemode.js.treemode._onAction (treemode.js:453)
    at Node.push../node_modules/jsoneditor/src/js/Node.js.Node.sort (Node.js:3757)
    at Node.push../node_modules/jsoneditor/src/js/Node.js.Node.setValue (Node.js:491)
    at new Node (Node.js:37)
    at JSONEditor.push../node_modules/jsoneditor/src/js/treemode.js.treemode.set (treemode.js:180)
    at JSONEditor.push../node_modules/jsoneditor/src/js/JSONEditor.js.JSONEditor.setMode (JSONEditor.js:290)
    at JSONEditor.push../node_modules/jsoneditor/src/js/JSONEditor.js.JSONEditor._create (JSONEditor.js:199)
    at new JSONEditor (JSONEditor.js:149)
    at JsonEditorComponent.ngOnInit (ang-jsoneditor.js:68)

Ace editor options creates an exception

Hi,

I've been trying to use the example to alter the Ace Editor options with the following:

  ngAfterViewInit(): void {
    const aceEditor = (<any>window).ace.edit(document.querySelector('#a' + this.editor.id + '>div'));
    // custom your ace here
    aceEditor.setReadOnly(true);
    aceEditor.setFontSize('110pt');
    this.options.ace = aceEditor;
    this.editor.setOptions(this.options);
  }

However, when this is evaluated, I get the following error:

TypeError: undefined is not a function (evaluating '_ace.edit(this.editorDom)') (line 187) (so edit is not a defined function here it seems).

At first I thought it was because ngAfterViewInit would evaluate too early, so I tried with using a button to manually trigger this, but I get the same error.

This has been tested with:

"ang-jsoneditor": "1.6.1",
"jsoneditor": "5.19.2",
"@angular/xx": "6.1.1"

I suppose you could easily reproduce by calling the setAce function in the unit-test of https://github.com/mariohmol/ang-jsoneditor/blob/master/src/app/demo/demo.component.ts.

TS6059: File '../node_modules/ang-jsoneditor/index.ts' is not under 'rootDir'

I am using Angular4JsonEditor in my angular application. Now we are migrating to Angular5, however angular5 jsoneditor is failing with below given errors. Do you have any solution?

TS6059: File '../node_modules/ang-jsoneditor/index.ts' is not under 'rootDir' 'C:\GitRepos\angular5project1\src'. 'rootDir' is expected to contain all source files.

at Object.<anonymous> (C:\GitRepos\ppc-admin-module\node_modules\ng-packagr\lib\ngc\compile-source-files.js:69:35)
at Generator.next (<anonymous>)
at C:\GitRepos\ppc-admin-module\node_modules\ng-packagr\lib\ngc\compile-source-files.js:7:71
at new Promise (<anonymous>)
at __awaiter (C:\GitRepos\ppc-admin-module\node_modules\ng-packagr\lib\ngc\compile-source-files.js:3:12)
at Object.compileSourceFiles (C:\GitRepos\ppc-admin-module\node_modules\ng-packagr\lib\ngc\compile-source-files.js:19:12)
at Object.<anonymous> (C:\GitRepos\ppc-admin-module\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js:20:60)
at Generator.next (<anonymous>)
at C:\GitRepos\ppc-admin-module\node_modules\ng-packagr\lib\ng-v5\entry-point\ts\compile-ngc.transform.js:7:71
at new Promise (<anonymous>)

The expandAll option triggers warnings in the console

This was probably introduced with my expandAll PR, I don't understand how did I miss it. The console warning doesn't cause any functional issue and looks like this:

I'm about to file a PR.

Missing mainMenuBar option

navigationBar and statusBar are inside the options class definition, but the mainMenuBar is missing:

ang-jsoneditor/ang-jsoneditor/src/jsoneditor/jsoneditor.component.ts

Line 205 in e3da72b

public navigationBar: boolean;

Removing insert and duplicate in case of tree mode

Hi,
I am trying to use angular jsoneditor for JSON array using mode tree.

For JSON array I am trying to implement changes that would help duplicate each array, but I want to disable the option to duplicate items in the array.

How can I achieve this?

I have been trying to by applying styles, but the class associated is the same throughout and would remove all duplicate options.

Error: The missing file seems to be part of a third party library

ERROR in ./node_modules/ang-jsoneditor/jsoneditor/jsoneditor.component.ts
Module build failed: Error: /home/oleksandr/Projects/free/mongoschema_editor/node_modules/ang-jsoneditor/jsoneditor/jsoneditor.component.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in the library repository to alert its author and ask them to package the library using the Angular Package Format (https://goo.gl/jB3GVv).
    at AngularCompilerPlugin.getCompiledFile (/home/oleksandr/Projects/free/mongoschema_editor/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:656:23)
    at plugin.done.then (/home/oleksandr/Projects/free/mongoschema_editor/node_modules/@ngtools/webpack/src/loader.js:467:39)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:188:7)
 @ ./src/app/components/schema-edit.component/schema-edit.component.ts 24:29-86
 @ ./src/app/app.module.ts
 @ ./src/main.ts
 @ multi ./src/main.ts

Missing 'templates' option in JsonEditorOptions

Describe the bug
It looks like the 'templates' option is missing in the JsonEditorOptions class. It allows preparing predefined JSON parts to be easily inserted.

Expected behavior
JsonEditorOptions should have templates field allowing to set an array of "buttons" (text, title, className, field, value: any )

Screenshots
If applicable, add screenshots to help explain your problem.
Screen from JSONEditor options linked from README.

How do we add the options for ace editor using ang-jsoneditor node module.

How do we add the options for ace editor using ang-jsoneditor node module. because could not see any of my solution is working. i am using latest version of angular that is 6.

I also wanted to disable the jsoneditor repair option which came in code mode

here i don't want to use the css to disable that feature

Unable to set a schema or enforce schema validation.

Am hoping to use the editor in an Angular 7 application to validate JSON. The JSON data is appearing in the editor but I am unable to assign a schema against which I can validate the JSON. I've tried the below in my .ts file but the validation does not kick in and no errors appears either.

this.editorOptions.schema = this.mySchemaAsJson
this.editor.setSchema(this.mySchemaAsJson)

Can't resolve 'jsoneditor' in '\node_modules\ang-jsoneditor\fesm5'

Describe the bug
I only did npm install on the library and imported it in the component module, then use it's component in the html and then the error occurs. By the way, my angular version is Angular 6

To Reproduce
Steps to reproduce the behavior:

1. npm install --save ang-jsoneditor
2. Import module in component module

Expected behavior
It must not occur an error.

Local json file data

Hi,
I have download code here and demo code is working fine.
But, I have faced issue, when I load json data from local directory and load to JSOn editor.

jsonRead(): void{
this.demoservice.getConfig().subscribe(d => {
this.data = d;
this.changeData();
console.log(this.data);
});
}

Updated json data is not reflected in json editor template.

Can you please give a solution for the same?

Thanks,
Nilesh.

onchange causes many console.errors!

Hey,

I've use the onchange method to validate keys with my custom regex:

this.editorOptions.onChange = () => {
      this.validateJson(this.schemaEditor.get(), 'schemaErrorMessages');
};

But whenever I use the "onchange"-Method there are many errors thrown into the console while typing. I have also tested in in your stackblitz demo there it has the same functionality.

Add maxVisibleChilds option

Is your feature request related to a problem? Please describe.

When it exceeds the childs more than 100, it shows show more and show all options, so provide maxVisibleChilds in option so that limit will be customizable.

ViewChild(JsonEditorComponent) editor: JsonEditorComponent returns undefined

`import { Component, OnInit, Input, ViewChild } from '@angular/core';
import { JsonEditorComponent, JsonEditorOptions } from 'ang-jsoneditor';

@component({
selector: 'app-code-view',
templateUrl: './code-view.component.html',
styleUrls: ['./code-view.component.scss']
})
export class CodeViewComponent implements OnInit {
public editorOptions: JsonEditorOptions;
@ViewChild(JsonEditorComponent) editor: JsonEditorComponent;

constructor() {

this.editorOptions = new JsonEditorOptions();
console.log('editorOptions', this.editorOptions);
console.log('editor', this.editor); => UNDEFINED?
this.editor.setOptions(this.editorOptions);

}

ngOnInit() {

}

}
`

@mariohmol any idea why this.editor logs as undefined? Also this this.editorOptions.ace deprecated?

onError not working?

Hi,
I'm trying to attach a method on onError but even though the editor shows the error icon it doesn't get called at all.
Thanks

Error editing data

The editor display as below.


The "type" is a string, but not rendered right, and after I clicked on the checkbox, an error occurred, "TypeError: VanillaPicker is not a constructor".
After clicked on the "batch" checkbox, the editor displayed an unknown JSON data, and an error occurred, "TypeError: Cannot read property 'length' of null".

Styling is not functioning on imported json-editor Component

I seem to be having a CSS issue with this angular module. The module has been imported but I have not been able to get any of the image assets or stylings to render. I have tried the import suggested on the readme:

@import "~jsoneditor/dist/jsoneditor.min.css";

But that did not work in my .scss style file. It did not cause any issues but it did not resolve the style issues. I also tried importing the original styles directly in the application by copying the style sheet from:

https://github.com/josdejong/jsoneditor/blob/master/dist/jsoneditor.css

This also requires importing img/jsoneditor.svg found here:

https://github.com/josdejong/jsoneditor/blob/master/dist/img/jsoneditor-icons.svg

Unfortunately none of these steps fixed the issue. Could you please advise on next steps? If it was just a CSS issue I would have expected to see the icons after I did the manual import of the style and images.

Thanks for any support you are able to provide.

Pull request to official repo

Hey, can you make a pull request to the official repo you forked? Or are you planning on using the library here?

Change default language

Hello,

I try to change default language this way, but it doesn't works :

this.editorOptions.language = 'pt-BR';

Please let me know if there's something I am overlooking.

Modify the JsonEditorOptions to prevent type validation?

Is there a way to modify the JsonEditorOptions to prevent type validation? I would like the editor to treat the "value" only as string, is it possible? The editor interprets a string value that is starting by "0" as a number and prevent me from having a leading 0.

Thanks for your help and for the Editor! It's appreciated.

Issues with javascript library?

Hello. I am having difficulty using your angular component and it is likely due to my ignorance since I have really only used angular 2 in the past. I am recieving exceptions in the console. I have some theories but I would really appreciate some help. When I run your demo project I do not have problems however when I import the module and use it in a second project I get the error message below:

compiler.js:215 Uncaught Error: Template parse errors:
Can't bind to 'options' since it isn't a known property of 'json-editor'.

1. If 'json-editor' is an Angular component and it has 'options' input, then verify that it is part of this module.
2. If 'json-editor' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("com/mariohmol/ang-jsoneditor/blob/master/src/app/demo/demo.component.html -->
   <json-editor [ERROR ->][options]="editorOptions" [data]="dataSetJson" #editor>
   <!-- <mat-form-fiel"): ng:///SharedModule/CustomDatasetComponent.html@24:22
   Can't bind to 'data' since it isn't a known property of 'json-editor'.
4. If 'json-editor' is an Angular component and it has 'data' input, then verify that it is part of this module.
5. If 'json-editor' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
6. To allow any property add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component. ("or/blob/master/src/app/demo/demo.component.html -->
   <json-editor [options]="editorOptions" [ERROR ->][data]="dataSetJson" #editor>
   <!--
   <m"): ng:///SharedModule/CustomDatasetComponent.html@24:48
   'json-editor' is not a known element:
7. If 'json-editor' is an Angular component, then verify that it is part of this module.
8. If 'json-editor' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("tps://github.com/mariohmol/ang-jsoneditor/blob/master/src/app/demo/demo.component.html -->
   [ERROR ->]<json-editor [options]="editorOptions" [data]="dataSetJson" #editor>
   <!-- <"): ng:///SharedModule/CustomDatasetComponent.html@24:9
   at syntaxError (compiler.js:215)
   at TemplateParser.push../node_modules/@angular/compiler/fesm5/compiler.js.TemplateParser.parse (compiler.js:14702)
   at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._parseTemplate (compiler.js:22709)
   at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileTemplate (compiler.js:22696)
   at compiler.js:22639
   at Set.forEach ()
   at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileComponents (compiler.js:22639)
   at compiler.js:22549
   at Object.then (compiler.js:206)
   at JitCompiler.push../node_modules/@angular/compiler/fesm5/compiler.js.JitCompiler._compileModuleAndComponents (compiler.js:22548)

Angular 9 support?

Do you intend to update the library so it supports angular 9?

implementing callbacks for onChangeJSON is problematic...

Describe the bug
I've implemented the editor with the angular wrapper, and have specified functions for onChange and onChangeJSON. onChange can be bound within the template, whereas onChangeJSON cannot, so I've added it to the editorOptions object.

this.editorOptions = new JsonEditorOptions();
this.editorOptions.mode = 'tree';
this.editorOptions.onChangeJSON = this.onEditorChangeJSON.bind(this);

At runtime, the value provided in the onChangeJSON callback is the entire json object, rather than the more fine grained values suggested by the documentation. What's more, the closure context of the function is the options object, rather than the component. I've addressed that by defining the options object like so:

This results in a somewhat odd way to access the editor in the callback:

onEditorChangeJSON(json) {
    const json2 = this.editor.editor.get(); // notice how the editor is now a private member of the component reference.
}

Also, the get method returns the entire json, rather than the finer grained value that had changed.

Expected behavior
onChangeJSON should behave as suggested in the json-editor documentation:
"Set a callback function triggered when the contents of the JSONEditor change. Passes the changed contents as a JSON object."

Is this a bug, an implementation issue, or something else?

Console and Error stack trace
No error.

Desktop (please complete the following information):

• OS: Windows 10
• Browser: Chrome
  "@angular/core": "~8.2.2",
  "ang-jsoneditor": "^1.8.2",
  "jsoneditor": "^6.2.1",

Unable to find README.md from npmjs.com - see screenshot

<json-editor> is not recognised

In my html i am using like this
<json-editor [options]="editorOptions" [data]="data">

</json-editor>

complains as unknown tag

using angular 6

Is there a plan to support angular 8

Make validateSchema method accessible

Hi,

I am using JSON Editor to validate JSON against the schema and I need to disable "Save" button in case when either JSON is not valid or JSON doesn't match the schema. In first case I simply check by getting JSON, but for second I need to use validateSchema method that accepts JSON object and checks if it matches the schema. This method is however unavailable, so I had to use any typing for JsonEditorComponent to access private editor property and call validateSchema method on it. Can you, please, add it?

Error in onChange callback: TypeError: Cannot read property 'get' of undefined

Describe the bug
this.editor throws me error whatever i try.

To Reproduce
Here my codes:

<json-editor #editor formControlName="body" *ngIf="this.mockForm.get('userResponseSelection').value == '1'" class="col-md-12" [options]="options" [data]="data" (jsonChange)="changeLog($event)"></json-editor>

 @ViewChild('editor', {static: true}) editor: JsonEditorComponent;

  options = new JsonEditorOptions();

  data = {
    products: [{
      name: 'car',
      product: [{
        name: 'honda',
        model: [
          {id: 'civic', name: 'civic'},
          {id: 'accord', name: 'accord'},
          {id: 'crv', name: 'crv'},
          {id: 'pilot', name: 'pilot'},
          {id: 'odyssey', name: 'odyssey'}
        ]
      }]
    }]
  };

  constructor(private formBuilder: FormBuilder, private alertifyService: AlertifyService, private mockService: MockService, private formFillingService: FormFillingService) {
    this.options.mode = 'code';
    this.options.modes = ['code', 'text', 'tree', 'view'];
    this.options.onChange = () => {
      console.log(this.editor.get());
    }
    this.editor = new JsonEditorComponent;
  }

my console while typing every single char

Expected behavior
To get this.editor object onChange

Desktop (please complete the following information):

  _                      _                 ____ _     ___
   / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
  / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
 / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
/_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
               |___/
   

Angular CLI: 8.3.26
Node: 10.16.3
OS: win32 x64
Angular: 8.2.14
... animations, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.803.26
@angular-devkit/build-angular     0.803.26
@angular-devkit/build-optimizer   0.803.26
@angular-devkit/build-webpack     0.803.26
@angular-devkit/core              8.3.26
@angular-devkit/schematics        8.3.26
@angular/cdk                      8.2.3
@angular/cli                      8.3.26
@angular/material                 8.2.3
@ngtools/webpack                  8.3.26
@schematics/angular               8.3.26
@schematics/update                0.803.26
rxjs                              6.4.0
typescript                        3.5.3
webpack                           4.39.2

Additional context
I tried to run a small demo like here https://stackblitz.com/edit/angular-gx54gz?file=src%2Fapp%2Fapp.component.html, it did work but it couldnt work out at my real case.

Add an option to automatically expand all nodes

This is a feature request to have an option to have the json tree expanded by default.

Support missing getSelection/setSelection Methods

The library appears to be missing features related to text selection in the parent library. See the API Documentation for more information about these methods.

This will greatly help with things like focusing from a parent component.

API Documentation: https://github.com/josdejong/jsoneditor/blob/master/docs/api.md#jsoneditorsetselectionstart-end

TypeError

When I attempt to start the application, I am getting this error:

[error] TypeError: Object prototype may only be an Object or null: undefined
at setPrototypeOf ()
at Object.__extends (C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules\tslib\tslib.js:65:9)
at C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\template.js:115:17
at C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\template.js:314:6
at C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\template.js:3:17
at Object. (C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\template.js:9:3)
at Module._compile (internal/modules/cjs/loader.js:778:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:789:10)
at Module.load (internal/modules/cjs/loader.js:653:32)
at tryModuleLoad (internal/modules/cjs/loader.js:593:12)
at Function.Module._load (internal/modules/cjs/loader.js:585:3)
at Module.require (internal/modules/cjs/loader.js:692:17)
at require (internal/modules/cjs/helpers.js:25:18)
at C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\transform.js:20:22
at C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\transform.js:10:17
at Object. (C:\Users\user\source\repos\AngularJsonEditor\AngularJsonEditor\ClientApp\node_modules@angular\compiler-cli\src\ngtsc\indexer\src\transform.js:16:3)