Javascript 将状态值从组件绑定到日历中的html

我正在使用带自定义模板的角度日历，如下所示：

我在我的组件中有该日期的任务的日期和状态数组

arr = [
    { 3: "success" },

    { 1: "Rejected" },

    { 18: "success" },

    { 10: "Pending" },

    { 9: "success" },

    { 8: "Rejected" },

  ]

在html文件中，我在日历月视图的单元格中有下拉列表

我想做的是，如果arr中给出的日期状态为“成功”，则在日历中该日期下拉列表中选择的值为“成功”，与“拒绝”和“挂起”相同

HTML:

<ng-template #customCellTemplate let-day="day" let-locale="locale">
  <div class="cal-cell-top">
    <span class="cal-day-badge" *ngIf="day.badgeTotal > 0">{{ day.badgeTotal }}</span>
    <span class="cal-day-number">
      {{ day.date | calendarDate:'monthViewDayNumber':locale }}
      <select name="" id="dropdown" style="margin: 5px;color: cadetblue;width: 130px;">
        <option value="{{status}}" (click)="dropdownmethod2($event.target.value,day.date)" *ngFor="let status of status">{{status}}</option>
      </select>
    </span>
  </div>
  <!-- <small style="margin: 5px;" >There are {{ day.events.length }} events on this day</small> -->

</ng-template>

<div [ngSwitch]="view">
  <mwl-calendar-month-view [viewDate]="viewDate" [events]="events" (eventClicked)="handleEvent('Clicked', $event.event)"
    [cellTemplate]="customCellTemplate">
  </mwl-calendar-month-view>

  status= ['success',"pending","Rejected"]
  arr = [
    { 3: "success" },

    { 1: "Rejected" },

    { 18: "success" },

    { 10: "Pending" },

    { 9: "success" },

    { 8: "Rejected" },

  ]