Angular - Displaying objects as JSON

<!doctype html>

<html>

<head>
  <script src="./lib/main.ts"></script>
</head>

<body>
  <my-app>
    loading...
  </my-app>
</body>

</html>

//our root app component
import { Component, NgModule, VERSION } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';

@Component({
    selector: 'my-app',
    template: `
        <div>
            <h1>Angular Demo</h1>
            <h3 ngNonBindable>Here's {{myThing}}</h3>
            <div>{{myThing}}</div>
            <h3 ngNonBindable>Here's {{myThing | json}}</h3>
            <div>{{myThing | json}}</div>
        </div>
    `,
    styles: [`div { font-family: Courier; }`]
})
export class App {
    name: string;
    public myThing: any;
    
    constructor() {
        this.name = `Angular! v${VERSION.full}`;
        this.myThing =  {
        aNumber: 2,
        aString: 'Top Level String',
        anObject: {
            aNumber: 42,
            aString: 'Internal String'
            }
        };
    }
}

@NgModule({
    imports: [BrowserModule],
    declarations: [App],
    bootstrap: [App],
})
export class AppModule {}

// Shim the environment
import 'core-js/client/shim';

// Angular requires Zones to be pre-configured in the environment
import 'zone.js/dist/zone';

//main entry point
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app';

import './style.css';

platformBrowserDynamic().bootstrapModule(AppModule);

h1,
p {
    font-family: sans-serif;
}

{
    "name": "@plnkr/starter-angular",
    "version": "1.0.3",
    "description": "Angular starter template",
    "dependencies": {
        "@angular/common": "^6.0.9",
        "@angular/compiler": "^6.0.9",
        "@angular/core": "^6.0.9",
        "@angular/platform-browser": "^6.0.9",
        "@angular/platform-browser-dynamic": "^6.0.9",
        "core-js": "^2.5.5",
        "rxjs": "^6.1.0",
        "zone.js": "^0.8.26"
    },
    "main": "./lib/main.ts",
    "plnkr": {
        "runtime": "system",
        "useHotReload": true
    }
}

{
    "compilerOptions": {
        "experimentalDecorators": true
    }
}