Question

我是棱角分明的新手并尝试按照课程但由于某种原因，app.ts（我在plunkr角度样板中修改的唯一文件）将无法渲染。以下是我的代码：

    //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 {}

以下是错误打印输出：

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 [错误]   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:33:14 VM4073   plugin.js：385 TypeScript [错误]';'预期。（TS1005）VM4073   plugin.js：385 TypeScript [错误]   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:33:24 VM4073   plugin.js：385 TypeScript [错误]';'预期。（TS1005）VM4056   runtime.9ff15 ... 16d788666a54a.js：16错误：TypeScript转换   实例化失败   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.js正在加载   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js正在加载   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js       在We.eval（VM4073 plugin.js：319）       在步骤（VM4073 plugin.js：77）       在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事件跟踪Plunk Restore   边栏未定义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 [错误]   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:37:14 plugin.js：385   TypeScript [错误]';'预期。（TS1005）plugin.js：385 TypeScript   [错误] https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.ts:37:24   plugin.js：385 TypeScript [错误]';'预期。（TS1005）   runtime.9ff156e ... .js：16错误：TypeScript转换失败
  实例化https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/app.js
  正在加载https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js正在加载   https://run.plnkr.co/rhpwnL6UIQwCFOKZ/src/main.js       在We.eval（VM4073 plugin.js：319）       在步骤（VM4073 plugin.js：77）       在Object.eval [as next]（VM4073 plugin.js：26）       满足（VM4073 plugin.js：7）

难道我正试图以旧方式实现双向数据绑定吗？

Answer 1

正如Jonathan Lonowski所说，这是由于{ seasons: [ { seasonstitle: "Season 1", titles: "S1E1; S1E2; S1E3", }, { seasonstitle: "Season 2", titles: "S2E1; S2E2; S2E3", }, ] }中缺少一个clossing大括号。

app.ts没有在plunkr

1 个答案: