Html 使用ngx智能模式，如何在显示模式内容时仅评估模式内容

我正在开发一个angular应用程序。在此应用程序中，您可以创建某种支持票证。当用户创建完票据并单击send按钮时，我将显示一个包含所有提供信息的模式。该模式是ngx智能模式，customClass设置为引导模式

发完票后，我重新设置了整个表格。现在，即使未显示模式的内容，也似乎正在对其进行求值，这会导致“ERROR TypeError:无法读取null”错误的属性“name”，因为这些字段已重置

是否有办法仅在显示模态内容时对其进行评估

我试着这样做：

类别：{{selectedCategory？selectedCategory.name:'}}

这是可行的，但我不确定这是否是一个好方法

我的情态：

<ngx-smart-modal #confirmSendTicket identifier="confirmSendTicket" [customClass]="'modal-body'">
  <div style="text-align: left">
    <h3>Send ticket?</h3>
    <span>
      <p>Caller:</p>
      <p>Section: {{selectedSection ? selectedSection.name : 'N/A'}}</p>
      <p>Lastname: {{this.lastname || 'N/A'}}, Firstname: {{this.firstname || 'N/A'}}, Phone
        {{this.phone || 'N/A'}}</p>
      <p>Category: {{selectedCategory.name}}</p>
      <p>Issue: {{selectedIssuesubject.name}}</p>
      <p *ngFor="let field of ticketissuesubjectFields">{{field.name + ': '}} <br /> {{field.content}}</p>
      <p>Ticketinformation:</p>
      <p>Title: {{emailSubject.value}}</p>
      <p>Description: <br />{{descriptionText.value}}</p>
      <p>Solution: <br />{{solution.value || 'N/A'}}</p>
      <p>Problem solved: {{solved.value ? 'Yes' : 'No'}}</p>
      <p *ngIf="!solved.value">Info: <br />{{info.value}}</p>
      <p>Start date: {{selectedStartDate.value.toLocaleString()}}</p>
      <p>End date: {{selectedEndDate.value.toLocaleString()}}</p>
      <p>Assessment: {{selectedAssessment.value.name}}</p>
      <p>Sending mails to: <br /></p>
      <p *ngFor="let user of selectedEmailUsers">{{user.lastname + ', ' + user.firstname}} <br /></p>
    </span>
  </div>
  <div class="row">
    <div class="col-md-6">
      <button type="button" (click)="onConfirmSendTicket()" class="btn btn-block btn-success">Send</button>
    </div>
    <div class="col-md-6">
      <button type="button" (click)="onReject()" class="btn btn-block btn-dark">Cancel</button>
    </div>
  </div>
</ngx-smart-modal>

送票吗？
来电者：

节：{{selectedSection？selectedSection.name:'N/A'}

姓氏：{{this.Lastname | |'N/A'}，姓氏：{{{this.Firstname | |'N/A'}，电话
{{this.phone | |'N/A'}

类别：{{selectedCategory.name}

问题：{{selectedIssuesubject.name}

{{field.name+'：'}}}
{{field.content}

票务信息：

标题：{{emailSubject.value}

描述：
{{descriptionContext.value}

解决方案：
{{Solution.value | |'N/A'}

问题已解决：{{solved.value？'Yes'：'No'}

Info:
{{Info.value}

开始日期：{{selectedStartDate.value.toLocaleString（）}}

结束日期：{{selectedEndDate.value.ToLocalString（）}}

评估：{{selectedAssessment.value.name}

发送邮件至：

{{user.lastname+，'+user.firstname}}

邮寄
取消

您可以使用安全导航操作符使数据的解释成为可选的，如：

{{selectedSection？.name}

如果要显示替代字符串，可以在将数据注入视图之前使用计算器检查数据：

hydretesection（数据）{
返回{name:data.name | |'N/A'}；
}

您是否有指向解释安全导航操作员的来源的链接？我找不到适合我的东西？奇怪的是，当我把它放在插值中时，它似乎起作用了，但我不能在我的typescript代码中使用它？安全导航操作符只在HTML的插值括号中使用，请在此处查找官方文档：在组件中，您必须为常量定义一个接口类型，如下所示：

export interface Section{name:string}const mySection：节；console.log（this.section.name）；//这不会返回未定义的错误