app.component.ts

import { Component } from '@angular/core';
import { Message } from './message';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {

  name = '';

  price = '';

  quantity = '';

  messages: Message[] = [];

  addMessage(): void {

 // 防呆，避免名稱或內容是空值時也可以留言
  if (
    !this.name.trim() && !this.messages.trim() && !this.quantity.trim()
  ) {
    return;
  }

  // 用名稱跟內容產生一個留言的資料物件
  const message = new Message(this.name, this.price, this.quantity);

  // 將留言的資料物件放進容器裡
  this.messages.push(message);

}

  total():void {
  }

  buildMessage(): void {

  }

  remove(): void {
    this.messages.remove(new Message);
  }


}