deeleman / learning-angular2

Code samples repository for the examples provided in "Learning Angular 2", published by Packt Publishing - THE BOOK COVERS UP TO RC.1 and hence is severely OUTDATED. PLEASE REFER TO THE LATEST EDITIONS INSTEAD.
https://www.packtpub.com/web-development/learning-angular-2
108 stars 59 forks source link

i18nPluralPipe errors #25

Open jim-coffey opened 8 years ago

jim-coffey commented 8 years ago

Chapter04 issue initially

OK, so I've been using Angular 2.0.0-rc.4 so maybe these are my own fault, but the i18nPlural pipe filter doesn't work with the provided code.

In order to make it work I had to do the following inside the .ts file :

Import the NgLocalization provider

import {
  NgLocalization
} from '@angular/common';

Extend the class to define a getPluralCategory method on it

class MessagesLocalization extends NgLocalization {
  getPluralCategory(value: any) {
    if (value > 1) {
      return 'other';
    }
  }
}

Inject the extended provider in to the bootstrap, although I think you can also add it to the providers key of the component individually

bootstrap(TasksComponent, [{provide: NgLocalization, useClass: MessagesLocalization}]);

Not sure if this area of angular2 just needs further development, or if this is the ideal fix going forward.

There are other angular2 plugins that can be used and injected to make the functionality work.

jim-coffey commented 8 years ago

In Chapter05 I fixed this just in the tasks.components.ts adding the following providers line to the TasksComponent @Component decorator :

providers: [provide(NgLocalization, { useClass: MessagesLocalization })]