UNPKG

ng-json-view

Version:

A JSON View component for Angular 10+

1 lines 4.53 kB
{"__symbolic":"module","version":4,"metadata":{"JsonViewComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":4,"character":1},"arguments":[{"selector":"json-view","template":"<div class=\"json-view\">\n <a (click)=\"toggle()\">\n <span class=\"toggler\" [ngClass]=\"{'collapse': isOpen, 'expand': !isOpen}\" [style.visibility]=\"hasChildren?'visible':'hidden'\"></span>\n <span class=\"key\" *ngIf=\"key\">\n <span>{{key}}</span>\n <span>: </span>\n </span>\n <span class=\"value\">\n <span *ngIf=\"isObject\">\n {{ dataType }}\n <span *ngIf=\"isArray\">[ {{ $any(data)?.length }} ]</span>\n </span>\n <span *ngIf=\"!isObject\" [ngClass]=\"valueType\">{{ value }}</span>\n </span>\n </a>\n <div class=\"children\" *ngIf=\"hasChildren && isOpen\">\n <json-view *ngFor=\"let _key of childrenKeys\" [data]=\"data[_key]\" [key]=\"_key\" [level]=\"level+1\" [levelOpen]=\"levelOpen\" [levelLabels]=\"levelLabels\"></json-view>\n </div>\n</div>","styles":[".json-view a{cursor:pointer;text-decoration:none}.json-view .toggler{display:block;float:left;padding:0;text-align:center;width:1em}.json-view .collapse:before{content:\"-\"}.json-view .expand:before{content:\"+\"}.json-view .key{color:#92278f}.json-view .value{color:#000}.json-view .value .string{color:#3ab54a}.json-view .value .number{color:#25aae2}.json-view .value .boolean{color:#aa0d91}.json-view .value .null{color:#f1592a}.json-view .children{margin-left:1em}"]}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"key":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"level":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"levelOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"levelLabels":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"ngOnInit":[{"__symbolic":"method"}],"init":[{"__symbolic":"method"}],"levelLabelHandle":[{"__symbolic":"method"}],"levelOpenHandle":[{"__symbolic":"method"}],"childrenKeysHandle":[{"__symbolic":"method"}],"dataHandle":[{"__symbolic":"method"}],"toggle":[{"__symbolic":"method"}]}},"NgxJsonViewComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"ngx-json-view","template":"\n <div class=\"ngx-json-view\">\n <json-view [data]=\"data\" [level]=\"level\" [levelOpen]=\"levelOpen\" [levelLabels]=\"levelLabels\" class=\"json-view\"></json-view>\n </div>\n "}]}],"members":{"data":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"levelOpen":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"levelLabels":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}]}},"NgxJsonViewModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":6,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":8,"character":4}],"exports":[{"__symbolic":"reference","name":"NgxJsonViewComponent"}],"declarations":[{"__symbolic":"reference","name":"JsonViewComponent"},{"__symbolic":"reference","name":"NgxJsonViewComponent"}]}]}],"members":{}}},"origins":{"JsonViewComponent":"./component/json-view.component","NgxJsonViewComponent":"./component/ngx-json-view.component","NgxJsonViewModule":"./lib.module"},"importAs":"ng-json-view"}