app.ts is not rendering on plunkr

Question

I am new to angular and trying to follow a course but for some reason the app.ts(the only file I've modified in the plunkr angular boilerplate) won't render. Below is my code:

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

@Component({
  selector: 'my-app',
  template: `
  <form>
  <input type="text" required [(ngModel)]="model.search" ngControl="search" #inputSearch="ngForm">
  <p class="error" [hidden]="inputSearch.valid"> This input is required</p>


  </form>

  `,
  styles: [`
  .error {
    color: red;
    font-size: 11px;
  }
  `]
})
export class App {
  public model = {
    search: "" 
  }

  constructor() {

  }

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

Here is the error printout:

gtm.js?id=GTM-T6RZMX:168 GET https://static.ads-twitter.com/oct.js 0 () match.adsrvr.org/tra…addthis&ttd_tpi=1:1 GET https://match.adsrvr.org/track/cmf/generic?ttd_pid=addthis&ttd_tpi=1 0 () secure.adnxs.com/get…%24UID%26ssrc%3D1:1 GET https://secure.adnxs.com/getuid?https%3A%2F%2Fsu.addthis.com%2Fred%2Fusync%3Fpid%3D6%26puid%3D%24UID%26ssrc%3D1 0 () VM4056 runtime.9ff15…16d788666a54a.js:16 GET https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js 404 () VM4056 runtime.9ff15…16d788666a54a.js:16 GET https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.js 404 () VM4073 plugin.js:385 TypeScript [Error] https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:33:14 VM4073 plugin.js:385 TypeScript [Error] ';' expected. (TS1005) VM4073 plugin.js:385 TypeScript [Error] https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:33:24 VM4073 plugin.js:385 TypeScript [Error] ';' expected. (TS1005) VM4056 runtime.9ff15…16d788666a54a.js:16 Error: TypeScript transpilation failed Instantiating https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.js Loading https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js Loading https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js at We.eval (VM4073 plugin.js:319) at step (VM4073 plugin.js:77) at Object.eval [as next] (VM4073 plugin.js:26) at fulfilled (VM4073 plugin.js:7) editor-1.17.0.js:7 AUTH {token: "6930491cbf9152a726a2d76cb6e0d81e784e67a0", id: 1596808, data: {…}, service: "github"} editor-1.17.0.js:2 Event tracked Plunk Restore Sidebar undefined undefined runtime.9ff156e….js:16 GET https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js 404 () runtime.9ff156e….js:16 GET https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.js 404 () plugin.js:385 TypeScript [Error] https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:37:14 plugin.js:385 TypeScript [Error] ';' expected. (TS1005) plugin.js:385 TypeScript [Error] https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:37:24 plugin.js:385 TypeScript [Error] ';' expected. (TS1005) runtime.9ff156e….js:16 Error: TypeScript transpilation failed
Instantiating https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.js
Loading https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js Loading https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js at We.eval (VM4073 plugin.js:319) at step (VM4073 plugin.js:77) at Object.eval [as next] (VM4073 plugin.js:26) at fulfilled (VM4073 plugin.js:7)

Could it be that I'm trying to implement 2way data binding in an old way?

Answer 1

As was stated by Jonathan Lonowski, it was due to a missing clossing brace in the class App.