动态更改离子图标的文本

时间:2018-10-18 05:39:32

标签: html angular ionic-framework

如果我只想显示post.date,则下面的代码已经成功。

.ts代码:

posts: any;

constructor(public http: Http, public navCtrl: NavController, public navParams: NavParams, private viewCtrl: ViewController, private appCtrl: App) {
    this.http.get('http://example.com/GetData').map(res => res.json()).subscribe(data => {
      this.posts = data.caseApiList;
      console.log(this.posts);
    },
      err => {
        console.log("Oops!");
      });
  }

HTML

<ion-content padding>
  <ion-list>
    <ion-item *ngFor="let post of posts">
      <img [src]="post.caseAuthorImage" (load)="post.loaded = true" [hidden]="!post.loaded" />
      <img [src]="post.authorPortrait" [hidden]="post.loaded" />
      <h2 (click)="navigate(post.caseId)">{{post.title}}</h2>

      <div class="demo">
        <span style="width: 33%; text-align: center;">
          <ion-icon name="text"></ion-icon>
          {{post.hot}}
        </span>
        <span style="width: 33%; text-align: center;">
          <ion-icon name="text"></ion-icon>
          {{post.tag}}
        </span>
        <span style="width: 33%; text-align: center;">
          {{post.date}} //I want to get the interval between post.date and today
        </span>
      </div>
    </ion-item>
  </ion-list>
</ion-content>

但是现在我想显示post.date和今天之间的间隔。我试图添加一个功能,例如:

showPublishDate(publishDate: string): string {
    return publishDate + "days ago";
  }

但是如何使用此功能?

1 个答案:

答案 0 :(得分:1)

检查一下

<span style="width: 33%; text-align: center;">
          {{showPublishDate(post.date)}} //I want to get the interval between post.date and today
        </span>
 

showPublishDate(publishDate: string): string {
return Math.ceil((new Date() - new Date(publishDate))/86400 * 1000) + "days ago";
  }