Use Livestamp.js Ionic 3 Error


#1

Hello, I use Livestamp.js for humanies datetime like ‘a minute ago’. But give an error, explain below:

import { Component } from '@angular/core';
import { NavController } from 'ionic-angular';
import * as $ from 'jquery';
import moment from 'moment';
import '@bassettsj/livestamp';

@Component({
  selector: 'page-home',
  templateUrl: 'home.html'
})
export class HomePage {
        
        timeStamp: number = 1527633644;

	constructor(public navCtrl: NavController) {
              this.timeStamp;
	}

	ionViewDidLoad() {
	    moment.locale('en');
  	}

}

If use this work fine,

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
         <span data-livestamp="1527633644"></span>
</ion-content>

But if use this,

<ion-header>
  <ion-navbar>
    <ion-title>
      Ionic Blank
    </ion-title>
  </ion-navbar>
</ion-header>

<ion-content>
         <span data-livestamp="{{ this.timeStamp }}"></span>
</ion-content>

Give an error template,

Template parse errors:
Can’t bind to ‘livestamp’ since it isn’t a known property of ‘span’. (“pan>


<span [ERROR ->]data-livestamp=”{{ post.other.date_formatted.time_stamp }}">

Why?


#2

It uses jQuery :frowning:

Take a look at:

Try, .ts:

export class HomePage {

  public timeStamp = 1527633644;

  ...

}

.html:

<ion-content>
    <span data-livestamp="{{ timeStamp }}"></span>
</ion-content>

#3

Hay, thanks for answe. But still error,

Can’t bind to ‘livestamp’ since it isn’t a known property of ‘span’. ("

]data-livestamp="{{ timeStamp }}"> <ion-grid *ngIf="postLoading" class="ui-no-scroll ui-middle"): ng:///AppModule/HomePage.html@9:7

#4

You didn’t really read the answer.

Don’t use “livestamp”.
Don’t use moment.
Don’t use jQuery.
Do use date-fns.


#5

Opss, sory about that. Can date-fns update the date automaticly like facebook post date? I read the documentation not found about it.

Example;
“Andre said go to market - a second ago” (update automaticly to 1 minute ago, 2 minute ago, … n ago)


#6

Not very closely.


#7

Its not realtime, need reload page to change the date.