以下是您的管道可能的外观：

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({name: 'unknown'})
export class Unknown implements PipeTransform {
  transform(value: any): any {
    return value ? value : 'Unknown'
  }
}

在您的元件中，您需要包括管：

@Component({
...
pipes: [Unknown] // this is whatever you named your exported class

那么在你的html中你会有

...
<br /> Environments: {{object.environment | unknown}} //this is whatever name you put in the @Pipe decorator

就我个人而言，我更喜欢管道，因为它留给更清晰、更可读的html，并充分利用了你正在编码的框架

管道是一个很好的解决方案，但如果需要，可以直接在html中使用 *ngIf：

<button *ngFor="let object of objects; let i = index" type="button" style="text-align:left; margin-right: 10px; margin-bottom: 10px" class="btn btn-primary"
    Name: <span *ngIf="object.name">{{object.name}}</span> <span *ngIf="!object.name">Unknown</span>

const newData = this.someNestedArray.map((some:any)=>{
    return  {...some,
      changeRequests:some.changeRequests.map((request:any)=>{
            return {
              ...request,
              name:request.name === null ? "empty" : request.name,
              type:request.type === null ? "empty" : request.type,
              description:request.description === null ? "empty" : request.description
            }
      })
    }
 })

this.filteredArray = newData

在你的Angular 模板中

<div class="" *ngFor="let item of filteredArray">
      <div>{{item.name}}</div>
      <div>{{item.type}}</div> 
      <div *ngFor="let list of  item.changeRequests">
         <li  *ngIf="list.name !== 'empty' ">{{list.name}}</li>
         <li  *ngIf="list.type !== 'empty' ">{{list.type}}</li>
         <li *ngIf="list.description !== 'empty' ">{{list.description}}</li>
      </div>
    </div>