2017-04-21 80 views
0

我使用离子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> 

它工作正常。显示聊天信息。但我需要不显示相同的日期值,因为我叫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次。

如何停止反复调用功能?

回答

0

这样做的原因,是你在呼唤从模板功能:

{{checkdate(chat.date)}} 

这是你真的想避免,因为在模板中有功能的东西,意味着它们各自执行时间变化检测运行。在最坏的情况下,这会导致无限循环。

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

+0

Thanks.I分配变量只更新最后一项值的数组。 – ANISUNDAR

+0

我需要不显示重复value.can你帮我... – ANISUNDAR

+0

对不起,我不明白你的意思:)你能显示代码,而不是你已经尝试过吗? – Alex