lephyrus / ngx-translate-messageformat-compiler

Advanced pluralization (and more) for ngx-translate, using standard ICU syntax which is compiled with the help of messageformat.js.
MIT License
93 stars 29 forks source link

Angular 9 migration issue #57

Closed valentinHruzinski92 closed 4 years ago

valentinHruzinski92 commented 4 years ago

In process migration from angular 8 to angular 9 faced with next issue:

log.service.ts:46 ERROR TypeError: Cannot read property 'tileId' of undefined
    at tile (eval at value (messageformat.js:1), <anonymous>:1469:41)
    at TranslateDefaultParser.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslateDefaultParser.interpolateFunction (ngx-translate-core.js:350)
    at TranslateDefaultParser.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslateDefaultParser.interpolate (ngx-translate-core.js:300)
    at TranslateService.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslateService.getParsedResult (ngx-translate-core.js:1118)
    at TranslateService.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslateService.get (ngx-translate-core.js:1164)
    at TranslateDirective.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslateDirective.updateValue (ngx-translate-core.js:1726)
    at TranslateDirective.push../node_modules/@ngx-translate/core/fesm5/ngx-translate-core.js.TranslateDirective.checkNodes (ngx-translate-core.js:1675)
    at TranslateDirective.set [as translate] (ngx-translate-core.js:1585)
    at updateProp (core.js:22696)
    at checkAndUpdateDirectiveInline (core.js:22451)
    at checkAndUpdateNodeInline (core.js:31163)
    at checkAndUpdateNode (core.js:31125)
    at debugCheckAndUpdateNode (core.js:31759)
    at debugCheckDirectivesFn (core.js:31719)
    at Object.eval [as updateDirectives] (MeshTileComponent.html:66)
    at Object.debugUpdateDirectives [as updateDirectives] (core.js:31711)
    at checkAndUpdateView (core.js:31107)
    at callViewAction (core.js:31348)
    at execEmbeddedViewsAction (core.js:31311)
    at checkAndUpdateView (core.js:31108)
    at callViewAction (core.js:31348)
    at execEmbeddedViewsAction (core.js:31311)
    at checkAndUpdateView (core.js:31108)
    at callViewAction (core.js:31348)
    at execComponentViewsAction (core.js:31290)
    at checkAndUpdateView (core.js:31113)
    at callViewAction (core.js:31348)
    at execEmbeddedViewsAction (core.js:31311)
    at checkAndUpdateView (core.js:31108)
    at callViewAction (core.js:31348)
    at execEmbeddedViewsAction (core.js:31311)
    at checkAndUpdateView (core.js:31108)
    at callViewAction (core.js:31348)
    at execEmbeddedViewsAction (core.js:31311)

html code:

      tiMultilineTrancation
      *ngIf="tilesTitles.indexOf(tile.id) !== -1"
      i18n="@@meshPage.tile"
      [translate]="'meshPage.tile'"
      [translateParams]="{tileId: tile.id}"
    >
      {tile.id, select, search {Search} communication {Communication} home {Home} information {Information} tasks
      {Tasks} navigation {Navigation} calendar {Calendar} booking {Booking} other { {{ tile.id }} } }
    </div>```

module import:
```TranslateModule.forRoot({
      compiler: {
        provide: TranslateCompiler,
        useClass: TranslateMessageFormatCompiler,
      },
      loader: {
        provide: TranslateLoader,
        useClass: WebpackTranslateLoader,
      },
    }),
"@ngx-translate/core": "^12.1.2",
"ngx-translate-messageformat-compiler": "^4.6.0",

Problems with select messages. Simple translations work fine. It was no problem with angular 8.

lephyrus commented 4 years ago

I'll close this because of inactivity. @Malik19051992, feel free to provide the solution if there was one, or reopen if there wasn't.