Question

<div *ngFor="let bellNotification of earlierBellNotifications">
    <mat-checkbox (change)="updateNotificationEventStatus(bellNotification.key, $event)"
      [(ngModel)]="bellNotification.status==='READ'" (click)="$event.stopPropagation()" class="md-18">
      <span class="wd-notification-event-checkbox" i18n>MARK AS READ</span>
    </mat-checkbox>
</div>

尝试加载页面时，出现以下错误：

未捕获的错误：模板解析错误：解析器错误：意外的令牌   [bellNotification.status ==='READ'= $ event]中第33列的'='   ng：///AppSharedModule/BellNotificationComponent.html@43：12（“
  ] [（ngModel）] =“ bellNotification.status ==='READ'”（点击）=“ $ event.stopPropagation（）” class =“ md-18”>       ”）：ng：///AppSharedModule/BellNotificationComponent.html@43：12

我尝试用打字稿中的函数替换它，但仍然出现类似错误。

我尝试用来自typescript的值替换它，它可以工作，但是由于它仅来自ts并且不依赖于for循环迭代器，因此无法动态更新。

有人可以帮我指出我使用的语法中的错误吗？

我是Angular的新手。参考链接非常感谢。

Answer 1

[(ngModel)]表达式中的条件绑定将不起作用（我从来没有这样使用过）！

您可以将[checked]属性用于 check/uncheck 复选框，其条件如下：

<div *ngFor="let bellNotification of earlierBellNotifications">
    <mat-checkbox (change)="updateNotificationEventStatus(bellNotification.key, $event)"  
        \/\/\/
      [checked]="bellNotification.status === 'READ'" (click)="$event.stopPropagation()" class="md-18">
      <span class="wd-notification-event-checkbox" i18n>MARK AS READ</span>
    </mat-checkbox>
</div>

Working_Demo

Mat-checkbox角度出现意外的令牌错误

1 个答案: