Giter VIP home page Giter VIP logo

ngx-moment's Issues

SystemJS import

do you have a working systemjs config for Angular2?

have to admit i am not too great with it and following #11 didnt help out either :/

i basically tried to just import it like any other module

//map block
'angular2-moment': '/node_modules/angular2-moment/'
//when referencing /module.js it seems to load the module but cant find any submodule i.e. CalendarPipe.js etc...

//packages block
'angular2-moment': { defaultExtension: 'js' }
//do i need the meta block here like in #11 ??

//wrapping up the config 
var config = {
    map: map,
    packages: packages
};

System.config(config);```

Update peer dependencies to Angular rc 4

Current the peer dependencies target a fixed Angular rc.0 reference, which makes it such that this package can't be used in the latest version of Ionic 2, which targets RC 4. Or, better yet, make this an unfixed peer dependency so there won't be conflicts in the future (if that's possible).

Thanks!

Immutable Moment RFC

Hi,

This is not really an issue, but it's the easiest way to get in contact with you - sorry about that :-).

I am one of the maintainers of Moment.js.
I want to make you aware of moment/moment-rfcs#2. This proposes adding a second immutable API to Moment.js for V3. We are quite serious about moving forward with this one, and are already in the process of prototyping code and seeing up the repo for this kind of change. Because being able to have both immutable and mutable objects coming from Moment will affect libraries that depend on it, like this one, I want to give you a heads up and ask you to add any comments you feel would be helpful.

There's also an executive summary of what's going on on my blog, if you don't want to read the whole thing: https://maggiepint.com/2016/07/16/immutability-its-happening/

We would greatly appreciate hearing what you think.

Maggie

Bower

Hi,

this seems nice! Is it possible to put it on bower?

Emmanuel

Cannot install it

Hi,

Is it possible to add a very neat seed that only includes angular2-moment (systemjs) because I cannot install it as I get dozen of errors. Some of the errors:

Cannot find module 'moment'.

File 'C:/GIT/TestProj/TestProj.Web/node_modules/angular2-moment/TimeAgoPipe.ts' is not under 'rootDir' 'C:/GIT/TestProj/TestProj.Web/wwwroot/app'. 'rootDir' is expected to contain all source files.

It is a pain in general words. A clear seed would highly appreciated

Can't find variable: window

Implementing this code example:

import {TimeAgoPipe} from 'angular2-moment';
@Component({
  selector: 'app',
  pipes: [TimeAgoPipe],
  template: `
    Last updated: <time>{{myDate | amTimeAgo}}</time>`
})

throws this error:

CONSOLE LOG file:///app/tns_modules/@angular/core/src/facade/lang.js:345:16: ORIGINAL E
XCEPTION: ReferenceError: Can't find variable: window

where is the problem?

Angular exception

I got the following error which I guess is related to the angular-moment pipe:

ORIGINAL EXCEPTION: Expression has changed after it was checked. Previous value: '
          (session expires in 21 minutes)
        '. Current value: '
          (session expires in 20 minutes)

Ad hoc any ideas? I will later debug in more depth and add some context.

Support unix timestamp as input

It would be great if the amDateFormat pipe or all pipes accept an unix timestamp(seconds) by argument configuration.

For example:
{{1456263980 | amDateFormat: ['hh:mmA', true]}} -> 13:45PM
true means input is unix timestamp

Timezone support in the future?

Thanks for the work of this lib.

Will timezone feature support in the future? Ideally, we can set timezone once instead of passing the timezone setting every time we used this lib.

Currently, if the input is "2016-05-23T00:39:23.610812Z" and the local time is 21:39, this lib does not show correctly because time zone feature has not been implemented. In Angular 1, everything is fine.

Thanks.

Locale not working

Hello,

the locale('de') not working

import {PipeTransform, Pipe} from '@angular/core';
import * as moment from 'moment';

// TODO: Move to another file
const momentConstructor: (value?: any) => moment.Moment = (<any>moment).default || moment;

@Pipe({
    name: 'dateFormat'
})
export class DateFormatPipe implements PipeTransform {
    public transform(date: any, args: any): any {
        let dateDE = momentConstructor(date).locale("de");
        return momentConstructor(date).locale("de").fromNow();
    }
}

Regards cvett

angular2 rc0

Hi,

Can you please update to @angular/2.0.0-rc.0?

Thank you!!

Does this support moment.to()?

I want to use the to() function to do in x days in x months etc. Is it being worked on? Or should I duplicate TimeAgoPipe.ts and change from() to to()?

Pipes should not be prefixed with 'am'

The prefixing of pipes with 'am' seems unnecessary, given pipes are included explicitly in components. Additionally, given the word 'am' is relevant to time already, it is confusing/misleading.

Also, dat's 2 xtra chars u got 2 typ.

Missing License

Hello, is there anyway you can add some license so that I can use the code in my project? Preferably something permissive like MIT license.

Use with Angular-CLI?

How do you use angular2-moment with an Angular-CLI generated application? I am getting the following errors after npm installing angular2-moment and importing a pipe:

[DiffingTSCompiler]: Typescript found the following errors:
node_modules/angular2-moment/CalendarPipe.ts (4, 25): Cannot find module 'moment'.
node_modules/angular2-moment/DateFormatPipe.ts (4, 25): Cannot find module 'moment'.
node_modules/angular2-moment/TimeAgoPipe.ts (4, 25): Cannot find module 'moment'.

When trying to run 'typings install --save moment' I get the following the error:

-bash: typings: command not found

Just one pipe?

Is there only the time ago pipe right now? Does this need contributions?

Update package.json

Hi, could you update the release version to make DateFormatPipe available?

Translating the pipe output

Is it possible to translate to another language the pipe output?

For example, changing "X Hours ago" to another language?

ParseError: 'import' and 'export' may appear only with 'sourceType: module

When is use amTimeAgo in template I have an error:


node_modules/angular2-moment/TimeAgoPipe.ts:3
import {Pipe, ChangeDetectorRef, PipeTransform, OnDestroy} from 'angular2/core';
^
ParseError: 'import' and 'export' may appear only with 'sourceType: module'

My package.js


{
  "dependencies": {
    "angular2": "2.0.0-beta.6",
    "angular2-moment": "^0.4.3",
    "es6-promise": "3.0.2",
    "es6-shim": "^0.33.13",
    "ionic-angular": "2.0.0-beta.3",
    "ionic-native": "^1.1.0",
    "ionicons": "3.0.0-alpha.3",
    "lodash": "^4.0.1",
    "moment": "^2.11.1",
    "reflect-metadata": "0.1.2",
    "rxjs": "5.0.0-beta.0",
    "zone.js": "0.5.14"
  },
  "devDependencies": {
    "del": "2.2.0",
    "gulp": "3.9.1",
    "gulp-watch": "4.3.5",
    "ionic-gulp-browserify-typescript": "^1.0.0",
    "ionic-gulp-fonts-copy": "^1.0.0",
    "ionic-gulp-html-copy": "^1.0.0",
    "ionic-gulp-sass-build": "^1.0.0",
    "ionic-gulp-scripts-copy": "^1.0.0"
  },
  "cordovaPlugins": [
    "cordova-plugin-whitelist",
    "cordova-plugin-device",
    "cordova-plugin-console",
    "cordova-plugin-splashscreen",
    "ionic-plugin-keyboard",
    "cordova-plugin-statusbar"
  ],
  "cordovaPlatforms": [
    "ios",
    {
      "platform": "ios",
      "version": "",
      "locator": "ios"
    }
  ],
}

Multi Language Support

Hey Guys,
❤️ I Love your work! Thank you :-)

Will you also support Multi Language?

support of undefined date

Hello @urish
thanks for this package. I have a user-list where deeply nested the property of the date value is stored:
user.state.lastLogin.date. Inside the ngFor not all dates are set - is it possible to set the undefined string to "" as empty string? Thanks

Issue integrating into angular2-seed

Hi, great module, but was having trouble getting it to work with angular2-seed (https://github.com/mgechev/angular2-seed) out-of-the-box. I was getting a 404 error when SystemJS was trying to find moment. For anyone using angular2-seed, and for @urish, only 1 line is needed to get it to work:

In tools/config/seed.config.ts, line 87, add the line between the comments:

  protected SYSTEM_CONFIG_DEV = {
    defaultJSExtensions: true,
// ADD THIS LINE
    packageConfigPaths: [`${this.APP_BASE}node_modules/*/package.json`],
//
    paths: {
      [this.BOOTSTRAP_MODULE]: `${this.APP_BASE}${this.BOOTSTRAP_MODULE}`,
      'angular2/*': `${this.APP_BASE}angular2/*`,
      'rxjs/*': `${this.APP_BASE}rxjs/*`,
      '*': `${this.APP_BASE}node_modules/*`
    },
    packages: {
      angular2: { defaultExtension: false },
      rxjs: { defaultExtension: false }
    }
  };

I'll post this in angular2-seed as well, since other modules may encounter the same issue.

Configure internationalization ?

Hi,
I'm developing an app that is international (English and French) and the dates are in English.
How to configure the language with this package ?

Thanks !

Cannot use in app due to triple-slash references

I'm trying to use this module, however my typescript stops transcribing after adding it, with the following message:

[0] node_modules/angular2-moment/TimeAgoPipe.d.ts(1,1): error TS2654: Exported external package typings file cannot contain tripleslash references. Please contact the package author to update the package definition.

Using Angular2 Beta.0

Angular compiler-cli issue

Bug description

I localized my app using the i18n attribute in a html tag. When I try to execute ng-xi18n, I get the following error:

Error: Unexpected value 'MomentModule' imported by the module 'AppModule'
    at /home/chris/workspace/my-webclient/node_modules/@angular/compiler/bundles/compiler.umd.js:14118:37
    at Array.forEach (native)
    at CompileMetadataResolver.getNgModuleMetadata (/home/chris/workspace/my-webclient/node_modules/@angular/compiler/bundles/compiler.umd.js:14103:46)
    at /home/chris/workspace/my-webclient/node_modules/@angular/compiler/bundles/compiler.umd.js:12947:58
    at Array.forEach (native)
    at OfflineCompiler.analyzeModules (/home/chris/workspace/my-webclient/node_modules/@angular/compiler/bundles/compiler.umd.js:12946:21)
    at Extractor.extract (/home/chris/workspace/my-webclient/node_modules/@angular/compiler-cli/src/extract_i18n.js:92:47)
    at extract (/home/chris/workspace/my-webclient/node_modules/@angular/compiler-cli/src/extract_i18n.js:16:35)
    at Object.main (/home/chris/workspace/my-webclient/node_modules/@angular/compiler-cli/node_modules/@angular/tsc-wrapped/src/main.js:30:16)
    at Object.<anonymous> (/home/chris/workspace/my-webclient/node_modules/@angular/compiler-cli/src/extract_i18n.js:161:9)
Extraction failed

This seems to be strongly related: yabab-dev/ng2-ckeditor#36
Obviously compiler-cli expects a .metadata.json or something. Would be great if you could take a look at this.

To reproduce:

  1. Create a new angular project
  2. Import the MomentModule in the main module
  3. npm install --saveDev @angular/compiler-cli
  4. Add a script in package.json: "extract": "ng-xi18n"
  5. Open app.component.html and add the i18n attribute somewhere on some tag. E.g: <h1>App works!</h1> to <h1 i18n>App works!</h1>
  6. On project root, run npm run extract
  7. You should now get the error

outDir changes when importing angular2-moment

As soon as I use an import-statement to include a file as a pipe, my build scripts stop working properly.
If my code is in /src, and I want everything inside /src to be compiled to /public it works as expected without an import.
So for example, /src/test.ts becomes /public/test.{map.}js.
As soon as I import this module, it adds another directory (the src directory)
So /src/test.ts becomes /public/src/test.{map.}js suddenly...

Other projects seem to have similar problems. See this issue from ng2-bootstrap: valor-software/ngx-bootstrap#128

Here is a Stackoverflow question, describing the very same problem I have (also, for ng2-bootstrap)
http://stackoverflow.com/questions/35648347/importing-ng2-bootstrap-changes-my-tsc-output-directory-structure

I hope this gets fixed soon, as I cant use this module if it messes up my whole directory structure...

Edit: I can confirm that this issue gets fixed if .ts (not .d.ts) files are moved into a separate directory

Expression X has changed after it was checked. Previous value...

Hi. As in readme, I've installed angular2-moment. It works perfect. The problem I'm having is, that I'm using the pipe in @Component:

<ion-card class="single-tweet">

  <ion-item>
    <ion-avatar item-left>
      <img src="{{tweet.user.profile_image_url_https}}">
    </ion-avatar>
    <ion-note item-right class="time">
      {{tweet.unixtime | amTimeAgo}}
    </ion-note>
    <div class="name">{{tweet.user.name}}</div>
    <small class="screen-name">@{{tweet.user.screen_name}}</small>
  </ion-item>

</ion-card>

I use this component on ListAll page. When clicking single ion-card, I'm jumping to details page, where I'm again using component above. If, in the meantime I update my tweet variable, I'll then get this error:

browser_adapter.js:76 EXCEPTION: Expression '
      {{tweet.unixtime | amTimeAgo}}
     in SingleTweet@7:38' has changed after it was checked. Previous value: '39 minutes ago'. Current value: '40 minutes ago' in [
      {{tweet.unixtime | amTimeAgo}}
     in SingleTweet@7:38]

and then:

TypeError: Cannot read property 'removeEventListener' of undefined
    at Content.ngOnDestroy (content.js:79)
    at AbstractChangeDetector.ChangeDetector_DetailPage_0.dehydrateDirectives (viewFactory_DetailPage:81)
    at AbstractChangeDetector.dehydrate (abstract_change_detector.js:141)
    at AbstractChangeDetector.destroyRecursive (abstract_change_detector.js:158)
    at AbstractChangeDetector.destroyRecursive (abstract_change_detector.js:165)
    at AppView.destroy (view.js:111)
    at AppViewManager_.destroyViewInContainer (view_manager.js:124)
    at ViewContainerRef_.remove (view_container_ref.js:116)
    at Array.<anonymous> (nav-controller.js:1108)
    at ViewController.destroy (view-controller.js:420)

Should I in between somehow disable timeago when I do the update? Any help would be perfect 👍

Installation issues

The installation instructions are probably not enough (at least they were not enough for me). SystemJS does not know about angular2-moment and thus it doesn't work when it tries to load it at run time.

I had to add the following to the config object:

System.config({
  packages: {
    ... other packages here
,
    "angular2-moment": {
      main: "index.js",
      defaultExtension: 'js'
    }
  },
  map: {
    "angular2-moment": "/node_modules/angular2-moment",
  },
  paths: {
    "moment": "/node_modules/moment/moment.js"
  }
});

I am not an expert in systemJS or angular2 for that matter so If there is an easier way or if this was just localized to my installation then please tell me.

Unable to install

san@san-work:~$ cd /tmp

san@san-work:/tmp$ npm install angular2-moment

[email protected] postinstall /tmp/node_modules/angular2-moment
typings install

typings ERR! message Unable to resolve Typings dependencies
typings ERR! caused by Unable to find "typings.json" from "/tmp/node_modules/angular2-moment"

typings ERR! cwd /tmp/node_modules/angular2-moment
typings ERR! system Linux 3.16.0-60-generic
typings ERR! command "/usr/bin/nodejs" "/usr/lib/node_modules/typings/dist/bin/typings-install.js"
typings ERR! node -v v0.12.10
typings ERR! typings -v 0.6.8

typings ERR! If you need help, you may report this error at:
typings ERR! https://github.com/typings/typings/issues

npm ERR! Linux 3.16.0-60-generic
npm ERR! argv "/usr/bin/node" "/usr/bin/npm" "install" "angular2-moment"
npm ERR! node v0.12.10
npm ERR! npm v2.14.9
npm ERR! code ELIFECYCLE

npm ERR! [email protected] postinstall: typings install
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] postinstall script 'typings install'.
npm ERR! This is most likely a problem with the angular2-moment package,
npm ERR! not with npm itself.
npm ERR! Tell the author that this fails on your system:
npm ERR! typings install
npm ERR! You can get their info via:
npm ERR! npm owner ls angular2-moment
npm ERR! There is likely additional logging output above.

npm ERR! Please include the following file with any support request:
npm ERR! /tmp/npm-debug.log
san@san-work:/tmp$


/tmp/npm-debug.log here https://drive.google.com/file/d/0B5sf8URbEXr8NTQxRVk4X1hremc/view?usp=sharing

angular2-moment is not working with ionic2

I am using angular2-moment with ionic2.Its giving me error
EXCEPTION: Error: Uncaught (in promise): No Pipe decorator found on TimeAgoPipe.

I import TimeAgoPipe as
import {TimeAgoPipe} from "angular2-moment/TimeAgoPipe.js";
Or
import {TimeAgoPipe} from "angular2-moment";

i both situation i m getting error

Moment locale not woking

Hi!

I'm trying use the moment and set the locale, but the language isn't changing.
I set the language, as below:

moment.locale('pt-BR');

But the output is:

a few seconds ago

Version of Angular2-moment: 0.4.3
What I need do to work?

i had bug in angular2-moment

i used ionic 2 and angular2 for build app.

im run npm install --save angular2-moment
and i add import {TimeAgoPipe} from 'angular2-moment';
pipes: [TimeAgoPipe],
for file .js
but it error
Module parse failed: D:\xampp\htdocs\1000ngayvang_app\node_modules\angular2-mome
nt\TimeAgoPipe.ts Line 3: Unexpected token
You may need an appropriate loader to handle this file type.

Performance issue

I'm trying to convert an app using ng-upgrade from angular1 to angular2, and I noticed that adding the amTimeAgo pipe to one of my pages completely kills the performance.

The pipe is used in a section that is below a *ngFor. Upon JS profiling, I noticed that the transform method of this pipe is being called repeatedly, every tick, completely killing performance for the page.

I stepped through the code trying various things, and setting the pipe as pure fixes this, but it probably kills the dynamic update functionality.

Any ideas what could be wrong?

beta12 import error

hi I'm struggling after moving to angular2 beta12

 ✗ TypeScript error: /xxxx/node_modules/angular2-moment/CalendarPipe.ts(49,7): Error TS2322: Type 'EventEmitter<{}>' is not assignable to type 'EventEmitter<Date>'.
  Type '{}' is not assignable to type 'Date'.
    Property 'toDateString' is missing in type '{}'.
 ✗
/xxxxx/node_modules/angular2-moment/TimeAgoPipe.ts:3
import {Pipe, ChangeDetectorRef, PipeTransform, OnDestroy} from 'angular2/core';
^

Not found

I have installed package with npm (also for typescript) and getting console error:

Failed to load resource: http://localhost:5555/node_modules/moment/package.json the server responded with a status of 404 (Not Found)

I can see the package inside of node_modules with name angular2-moment.

Here are my parts of code:

import { DateFormatPipe } from 'angular2-moment';
{{meeting.scheduled.start | amDateFormat:'LL'}}

What could be wrong?

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.