Angular 2 TypeError:无法读取未定义的属性'toUpperCase'

Question

我正在开发一个医疗网站,当药物的数量<50时,我想在药剂.组件.HTML的页面中显示警报.我这样做了:

 <span *ngFor="let medicament of medicaments" >
        <span *ngIf="{{medicament.quantity}} < 50">
             <div class="callout callout-danger lead">
          <h4>Alert!</h4>
          <p>Vous devez charger le stock de medicaments {{medicament.nom}}                         
  de type {{medicament.type}}  </p>
        </div>
        </span></span>

但我不知道为什么它不起作用,错误是:

       > Unhandled Promise rejection: Template parse errors:
        TypeError: Cannot read property 'toUpperCase' of undefined ("<span              
       *ngIf="medicaments">
    <span *ngFor="let medicament of medicaments" >
        <span [ERROR ->]*ngIf="{{medicament.quantity}} < 50">
             <div class="callout callout-danger lead">
       "): MedicamentComponent@26:18
     Can't bind to '*ngIf' since it isn't a known property of 'span'.             
     ("<span *ngIf="medicaments">
    <span *ngFor="let medicament of medicaments" >
        <span [ERROR ->]*ngIf="{{medicament.quantity}} < 50">
             <div class="callout callout-danger lead">
      "): MedicamentComponent@26:18

Answer 1

你不应该{{ }}在ngIf中使用插值; 它期望一个表达式:

<span *ngIf="medicament.quantity < 50">