Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ERROR in No Pipe decorator found on TimeAgoPipe #22

Open
ivissani opened this issue May 5, 2018 · 28 comments
Open

ERROR in No Pipe decorator found on TimeAgoPipe #22

ivissani opened this issue May 5, 2018 · 28 comments

Comments

@ivissani
Copy link

ivissani commented May 5, 2018

I've got the aforementioned error when running ng serve --aot
Angular version is 5.1.1.

No error when serving with just ng serve

@heintj
Copy link

heintj commented May 16, 2018

I am having the same issue, without fix.

@safaldas
Copy link

i too am having issue

@danduh
Copy link

danduh commented May 25, 2018

Same issue, any ideas?

@freemanlam
Copy link

same issue

@SharmaTushar
Copy link

Issue still persists.

@AntonisFK
Copy link

Got this issue when upgrading to angular 6

@druvisc
Copy link

druvisc commented Sep 11, 2018

Same issue.

EDIT: Workaround for me was to just copy the source code and to create the file in my project.

@rvuyyuru1
Copy link

same issue

@jiboune
Copy link

jiboune commented Sep 19, 2018

+1

@hbarve1
Copy link

hbarve1 commented Sep 29, 2018

same issue.

maybe this will help, but this is for older version of this lib.
https://stackoverflow.com/questions/47119135/cannot-determine-the-module-for-component-angular-5

@JonesM87
Copy link

JonesM87 commented Oct 2, 2018

+1

@IshanBhuta
Copy link

Same for me

@DejanNemet
Copy link

DejanNemet commented Oct 23, 2018

Same error.

@AnilBhandare09
Copy link

same issue.

1 similar comment
@ayoubchebbi
Copy link

same issue.

@nijat12
Copy link

nijat12 commented Dec 10, 2018

Same issue with Angular 6.1.10

@jjgriff93
Copy link

same issue

@crufter
Copy link

crufter commented Jan 21, 2019

Same here :(

@ayoubchebbi
Copy link

ayoubchebbi commented Jan 21, 2019 via email

@etsraphael
Copy link

etsraphael commented Apr 30, 2019

Same issue.

I suggest everyone ngx-timeago it's better, I found my solution with this one

@tolotrasamuel
Copy link

What is the fix ?

@JonesM87
Copy link

JonesM87 commented Sep 24, 2019

You can fix this by adding the missing decorator, add this line:

@Pipe({ name: 'timeAgo' })

above the export line in the module source code, time-ago.pipe.d.ts

@shannon-kay
Copy link

Still seeing this issue with Ang 8, and the above didn't work for me.

@ajaysarw
Copy link

I also faced this issue and fixed by @JonesM87's suggestion.

@JSX001
Copy link

JSX001 commented Feb 12, 2020

still seeing this cant find a workaround.

ng serve - always works, but a save to any source file when it recompiles and I get the error.

strangely, only started happening after I inadvertently upgraded to Angular 9 and then had to uninstall and go back to angular 8.

@mikejoseph23
Copy link

still seeing this cant find a workaround.

ng serve - always works, but a save to any source file when it recompiles and I get the error.

strangely, only started happening after I inadvertently upgraded to Angular 9 and then had to uninstall and go back to angular 8.

Same issue here. I upgraded to Angular 9 yesterday and am getting this error on my local development web server (http://localhost:4200) ... I can run "ng serve" but if I change a file and it recompiles in response to me pressing "save" in my editor, this error appears:
image

In order to get going again, I have to kill the process and do a "ng serve" again, which takes a while. I'm probably going to have to comment out TimeAgo code for now until a fix is found. Luckily it's not referenced a whole lot, but would love to be able to reimplement it.

@kuldeeps1ngh
Copy link

same issue here, ng serve works fine, but on any change in any file, upon recompilation, this error throws back. Any solution ?

@BenjaminPoutriquet35800
Copy link

BenjaminPoutriquet35800 commented Apr 9, 2020

Hey guys certainly not best solution but it's work fine. Rewrite pipe class and export it.
Something like this :

import { Pipe, PipeTransform, NgZone, ChangeDetectorRef, OnDestroy } from '@angular/core';

@Pipe({
  name: 'timeAgo',
  pure: false
})
export class TimeAgoExtPipe implements PipeTransform, OnDestroy {
  changeDetectorRef: ChangeDetectorRef;
  ngZone: NgZone;
  timer: any;

  constructor(changeDetectorRef: ChangeDetectorRef, ngZone: NgZone) {
    this.changeDetectorRef = changeDetectorRef;
    this.ngZone = ngZone;
  }

  ngOnDestroy() {
    this.removeTimer();
  }

  transform(value: any, args?: any): any {
    this.removeTimer();
    const d = new Date(value);
    const now = new Date();
    const seconds = Math.round(Math.abs((now.getTime() - d.getTime()) / 1000));
    const timeToUpdate = (Number.isNaN(seconds)) ? 1000 : this.getSecondsUntilUpdate(seconds) * 1000;
    this.timer = this.ngZone.runOutsideAngular(() => {
      if (typeof window !== 'undefined') {
        return window.setTimeout(() => {
          this.ngZone.run(() => this.changeDetectorRef.markForCheck());
        }, timeToUpdate);
      }
      return null;
    });
    const minutes = Math.round(Math.abs(seconds / 60));
    const hours = Math.round(Math.abs(minutes / 60));
    const days = Math.round(Math.abs(hours / 24));
    const months = Math.round(Math.abs(days / 30.416));
    const years = Math.round(Math.abs(days / 365));
    if (Number.isNaN(seconds)) {
      return '';
    } else if (seconds <= 45) {
      return 'a few seconds ago';
    } else if (seconds <= 90) {
      return 'a minute ago';
    } else if (minutes <= 45) {
      return minutes + ' minutes ago';
    } else if (minutes <= 90) {
      return 'an hour ago';
    } else if (hours <= 22) {
      return hours + ' hours ago';
    } else if (hours <= 36) {
      return 'a day ago';
    } else if (days <= 25) {
      return days + ' days ago';
    } else if (days <= 45) {
      return 'a month ago';
    } else if (days <= 345) {
      return months + ' months ago';
    } else if (days <= 545) {
      return 'a year ago';
    } else {
      // (days > 545)
      return years + ' years ago';
    }
  }

  removeTimer() {
    if (this.timer) {
      window.clearTimeout(this.timer);
      this.timer = null;
    }
  }

  getSecondsUntilUpdate(seconds) {
    const min = 60;
    const hr = min * 60;
    const day = hr * 24;

    if (seconds < min) {
      // less than 1 min, update every 2 secs
      return 2;
    } else if (seconds < hr) {
      // less than an hour, update every 30 secs
      return 30;
    } else if (seconds < day) {
      // less then a day, update every 5 mins
      return 300;
    } else {
      // update every hour
      return 3600;
    }
  }
}

and in app.module.ts

import { TimeAgoExtPipe } from './_pipes/time-ago-ext.pipe';

finally replace TimeAgo pipe module by yours.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests