如何根据Angular中的对象属性在显示时更改背景颜色

// app.component.ts
import { Component } from '@angular/core';

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

<!-- app.component.html -->
<div [ngStyle]="{'background-color': getStatusColor(item.status)}">
  {{ item.status }}
</div>

// app.component.ts (continued)
getStatusColor(status: string): string {
  switch (status) {
    case 'active':
      return 'green';
    case 'inactive':
      return 'red';
    default:
      return 'white';
  }
}