Angular 2 Поставляемые параметры не соответствуют ни одной сигнатуре ошибки цели вызова

Я добавил код перевода в приложение Ionic 2 / Angular 2. Теперь, когда я строю с использованием ionic build android, я получаю ошибку Supplied parameters..., но не указано, какой файл / строка вызывает ошибку.

translate / translation.ts

import { OpaqueToken } from '@angular/core';

// import translations
import { LANG_AFR_TRANS } from './lang-afr';
import { LANG_EN_TRANS } from './lang-en';

// translation token
export const TRANSLATIONS = new OpaqueToken('translations');

// all translations
const dictionary = {
    afr: LANG_AFR_TRANS,
    en: LANG_EN_TRANS
};

// providers
export const TRANSLATION_PROVIDERS = [
    { 
        provide: TRANSLATIONS, 
        useValue: dictionary
    }
];

translate / lang-afr.ts

export const LANG_AFR_TRANS = {
    'hello world': 'Goie More',
    'Co-op Login': 'Kooperasie Inteken',
    'Username': 'Gebruikersnaam',
    'Password': 'Wagwoord',
    'Login': 'Teken in',
    'Sign in as a different user': "Teken in met 'n ander gebruikersnaam'?",
    'Forgot Password?': 'Ek het my wagwoord vergeet',
    'Username cannot be blank or contain numbers': 'Vul asb u gebruikersnaam in',
    'Incorrect username or password': 'Of gebruikersnaam of wagwoord is verkeerd',
    'Field cannot be blank please enter password': 'Vul asb u wagwoord in'
}

services / translate.ts

import { Injectable, Inject } from '@angular/core';
import { TRANSLATIONS } from '../translate/translation';

@Injectable()
export class TranslateService {
    private _currentLang: string;

    public get currentLang() {
        return this._currentLang;
    }

    // inject our translations
    constructor(@Inject(TRANSLATIONS) private _translations: any) {

    }

    public use(lang: string): void {
        // set current language
        this._currentLang = lang;
    }

    private translate(key: string): string {
        // private perform translation
        let translation = key;

        if (this._translations[this.currentLang] && this._translations[this.currentLang][key]) {
            return this._translations[this.currentLang][key];
        }

        return translation;
    }

    public instant(key: string) {
        return this.translate(key)
    }
}

трубы / translate.filter

import { Pipe, PipeTransform } from '@angular/core';
import { TranslateService } from '../services/translate';

@Pipe({
    name: 'translate',
    pure: false
})

export class TranslatePipe implements PipeTransform {
    constructor(private _translate: TranslateService) { }

    transform(value: string, args: any[]): any {
        if (!value) return;
        return this._translate.instant(value);
    }
}

pages / login / login.html

На странице входа есть кнопки, с помощью которых пользователь может выбрать предпочтительный язык, а translate фильтр используется там, где это необходимо.

...

<ion-item>
<ion-label floating>{{ 'Password' | translate }}</ion-label>
<ion-input type="password" formControlName="password"></ion-input>
</ion-item>
<div [hidden]="loginForm.controls.password.valid || (loginForm.controls.password.pristine && !loginForm.controls.password.touched)" class="validation-message">
{{ 'Field cannot be blank please enter password' | translate }}
</div>

<ion-item *ngIf="selectedLanguage">
    This application is currently in {{ selectedLanguage }}
</ion-item>

<button *ngFor="let lang of supportedLanguages" ion-button (click)="selectLang(lang)" class="btn btn-default" [disabled]="isCurrentLang(lang.value)">
{{ lang.display }}
</button>

...

pages / login / login.ts

export class LoginPage {
  ...

  public translatedText: string;
  public supportedLanguages: any;
  selectedLanguage: string;

  ...

  constructor( ... , private _translate: TranslateService) {
      ...

    // langauge buttons
    this.supportedLanguages = [
      {
        display: 'English',
        value: 'en'
      },
      {
        display: 'Afrikaans',
        value: 'afr'
      }
    ];

    let langPrefrence = localStorage.getItem("langPrefrence");

    if (langPrefrence) {
      this.selectLang(JSON.parse(langPrefrence));
     } else {
       this.selectLang({display: 'English', value: 'en'});
     };

     ... 
  }
  isCurrentLang(lang: string) {
    //check if the selected lang is current lang
    return lang === this._translate.currentLang;
  }
  selectLang(lang) {
    this.selectedLanguage = lang.display;
    this._translate.use(lang.value);
    localStorage.setItem("langPrefrence", JSON.stringify(lang));
    this.refreshText();
  }
  refreshText() {
    // refresh translation when language change
    this.translatedText = this._translate.instant('hello world');
  }
}

Ошибки:

введите здесь описание изображения

введите здесь описание изображения

введите здесь описание изображения


person Simo D'lo Mafuxwana    schedule 09.02.2017    source источник
comment
есть ли файл в /Users/simo/work/StraTech/abalobi-web/.tmp/pages/home/home.ngfactory.ts? Если да, то есть ли строка 350?   -  person n00b    schedule 10.02.2017
comment
Я думаю, это связано с определением трубы TranslatePipe. Попробуйте изменить определение метода преобразования на transform(value: string, args?: any[]): any или просто удалите параметр args, как этот transform(value: string): any. Сообщите мне, работает ли это, и я добавлю его в качестве ответа, чтобы помочь другим пользователям SO, столкнувшимся с той же проблемой :)   -  person sebaferreras    schedule 10.02.2017
comment
@sebaferreras, это сработало! Баззинга !!!!   -  person Simo D'lo Mafuxwana    schedule 10.02.2017
comment
Рад слышать! :) Я добавил ответ, чтобы другие пользователи SO с той же проблемой могли найти, как исправить это проще (когда это случилось со мной, я потратил несколько часов, пытаясь понять, что происходит ...)   -  person sebaferreras    schedule 10.02.2017


Ответы (1)


Я думаю, это связано с определением канала TranslatePipe. Сигнатура вашего метода выглядит так

transform(value: string, args: any[]): any

это означает, что метод ожидает 2 параметра. Однако, когда вы вызываете pipe через

{{ 'Password' | translate }}, по сути, вы передаете только один параметр, и, следовательно, возникает ошибка.

Попробуйте изменить определение метода преобразования на

transform(value: string, args?: any[]): any

или просто удалите параметр args, как это

transform(value: string): any.

person sebaferreras    schedule 10.02.2017