Angular проблема двустороннего связывания - PullRequest
Новая
       29

Angular проблема двустороннего связывания

0 голосов
/ 09 января 2020

Я нахожусь в классе Angular, и часть задания заключалась в создании страницы двусторонней привязки с формой. Я буквально не знаю, почему моя форма не отображается на странице, когда я ее запускаю. Вот код app.component.ts и репозиторий GitHub для этого https://github.com/Friend0fMisery/web-425/blob/master/week-2/singleton-two-way-binding/src/app/app.component.ts. Пожалуйста, помогите, я должен что-то упускать. 

import { Component } from '@angular/core';

@Component({
  selector: 'app-root',
  template: `
    <br /><br /><br />

    <div class="container-fluid two-way-form">
      <h2>Two-Way Binding Example</h2><br />
      <div class="form-group">
          <input class="form-control" type="text"
                placeholder="Enter your name ..."
                [(ngModel)]="name">
          <button class="btn btn-primary form-control" (click)="name=''">Clear Name</button>
      </div>
      <div class="form-group">
          <p class="alert-success">Welcome to the Jungle, {{name}}! </p>
      </div>


    </div>
  `,
  styles: [
    `
      h2 {
        color: orange;
        text-decoration: underline;
      }
      .form-group {
        background-color: light-grey;
      }
      p {
        color: green;
        font-size: 32px;
      }
      .two-way-form {
        width: 50%;
      }
    `
  ]
})
export class AppComponent {
  title = 'singleton-two-way-binding';
  name: string;
}
...