使用呼叫功能

Question

我使用离子2开发聊天应用。这是我的HTML代码

<ion-content padding>
  <div *ngIf="online === true">
      <ion-refresher (ionRefresh)="onPullOldMessages($event)">
          <ion-refresher-content></ion-refresher-content>
      </ion-refresher>
    <div class="chat" *ngIf="chatval">
      <div class="messagesholder" 
      *ngFor="let chat of chatval | orderby:'[date]';  let i = index;let first=first;let last = last;">
             <div *ngIf="chat.sender == currentuser || chat.receiver == currentuser" >
                   <p class="chat-date"   id="abc" #abc>{{chat.date | amDateFormat:'LL'}}</p>
                   {{checkdate(chat.date)}} 
              </div> 
         <div class="message" *ngIf="chat.sender == currentuser || chat.receiver == currentuser" [ngClass]="{'me': currentuser == chat.sender}">
                <div class='image' *ngIf="chat.path" >
                  <img *ngIf="chat.path" [src]="chat.path" imageViewer/><br>
                  <span *ngIf="chat.path_text">{{chat.path_text}}</span>
                  <span style="font-size:9px;">{{chat.date | amDateFormat:'hh:mmA'}}</span>
                </div> 
                 <div *ngIf="chat.message_text">
                 <span>{{chat.message_text}}</span>
                 <span style="font-size:9px;">{{chat.date | amDateFormat:'hh:mmA'}}</span>
                 </div>
          </div>
     </div>
   </div>  
 </div>
</ion-content>

它可以正常工作。显示CHAT味精。但是我需要显示相同的日期值，因为我打电话给 checkdate(chat.date)。

这是我的功能

checkdate(date)
  {
    var res = date.split(" ");
    var A=res[0];
    var local=localStorage.getItem('chatdate');
    this.msgdate="";
    if(local === undefined || local === null)
    {
      this.msgdate=A;
      localStorage.setItem('chatdate',this.msgdate);
    }
    else if(local !== undefined)
    {
      console.log(local != A);
      if(local != A)
      {
        this.msgdate = A;
         localStorage.setItem('chatdate',this.msgdate);
      }
    }
   console.log("date value");
   }

实际数组长度为3。但是此功能称为多次。我被检查了此功能调用多少次。因为我只是安慰了字符串值。它安慰了很多次，例如100次。

我如何停止重复称为函数？

Answer 1

的原因是，您是从模板中调用功能：

{{checkdate(chat.date)}} 

这是您真正想要避免的事情，因为模板中具有功能，这意味着每次运行更改检测时都会执行它们。在最坏的情况下，这会导致无限循环。

因此，建议是为了重构代码，以便您处理组件中的逻辑，将其分配给变量，并在模板中使用变量。