2017-11-16 37 views
0

にサービスを翻訳: How to use MatPaginatorIntl?は、私は次の実装に自分自身をベースMatPaginator

は、彼が私の暗示MatPaginatorIntl内TranslateServiceを追加しようとしました、それは私に次のようなエラーが表示されます。このコードはjhipsterの一部であり、この実装を共有のforder内に追加しました。

エラー:

Uncaught Error: Can't resolve all parameters for SharedPaginatorIntl: (?). 
at syntaxError (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:1917:34) 
at CompileMetadataResolver._getDependenciesMetadata (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:15984:35) 
at CompileMetadataResolver._getTypeMetadata (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:15852:26) 
at CompileMetadataResolver._getInjectableMetadata (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:15838:21) 
at CompileMetadataResolver.getProviderMetadata (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:16129:40) 
at eval (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:16058:49) 
at Array.forEach (<anonymous>) 
at CompileMetadataResolver._getProvidersMetadata (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:16018:19) 
at CompileMetadataResolver.getNgModuleMetadata (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:15673:50) 
at CompileMetadataResolver.getNgModuleSummary (eval at ./node_modules/@angular/compiler/@angular/compiler.es5.js (vendor.bundle.js:135), <anonymous>:15526:52) 

Shared folder structure

index.ts

export * from './constants/pagination.constants'; 
export * from './alert/alert.component'; 
export * from './alert/alert-error.component'; 
export * from './auth/csrf.service'; 
export * from './auth/state-storage.service'; 
export * from './auth/account.service'; 
export * from './auth/auth-oauth2.service'; 
export * from './auth/principal.service'; 
export * from './auth/has-any-authority.directive'; 
export * from './auth/user-route-access-service'; 
export * from './language/language.constants'; 
export * from './language/language.helper'; 
export * from './language/find-language-from-key.pipe'; 
export * from './tracker/tracker.service'; 
export * from './login/login.component'; 
export * from './login/login.service'; 
export * from './login/login-modal.service'; 
export * from './user/account.model'; 
export * from './user/user.model'; 
export * from './user/user.service'; 
export * from './model/response-wrapper.model'; 
export * from './model/request-util'; 
export * from './model/base-entity'; 
export * from './shared-libs.module'; 
export * from './shared-common.module'; 
export * from './shared.module'; 
export * from './own/shared-bce-table.component'; 
export * from './own/shared-table-query-service'; 
export * from './own/shared-data-source'; 
export * from './own/shared-paginator-intl'; 

shared.module.ts

import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core'; 
import { DatePipe } from '@angular/common'; 
import {TranslateModule} from '@ngx-translate/core'; 

import { 
BuildingcSharedLibsModule, 
BuildingcSharedCommonModule, 
CSRFService, 
AuthServerProvider, 
AccountService, 
UserService, 
StateStorageService, 
LoginService, 
LoginModalService, 
Principal, 
JhiTrackerService, 
HasAnyAuthorityDirective, 
JhiLoginModalComponent, 
} from './'; 

@NgModule({ 
imports: [ 
    BuildingcSharedLibsModule, 
    BuildingcSharedCommonModule, 
    TranslateModule 
], 
declarations: [ 
    JhiLoginModalComponent, 
    HasAnyAuthorityDirective 
], 
providers: [ 
    LoginService, 
    LoginModalService, 
    AccountService, 
    StateStorageService, 
    Principal, 
    CSRFService, 
    JhiTrackerService, 
    AuthServerProvider, 
    UserService, 
    DatePipe, 
    TranslateModule 
], 
entryComponents: [JhiLoginModalComponent], 
exports: [ 
    BuildingcSharedCommonModule, 
    JhiLoginModalComponent, 
    HasAnyAuthorityDirective, 
    DatePipe 
], 
schemas: [CUSTOM_ELEMENTS_SCHEMA] 

}) 
export class BuildingcSharedModule {} 

私の実装:

import {MatPaginator, MatPaginatorIntl} from '@angular/material'; 
import {Component} from '@angular/core'; 
import {TranslateService} from '@ngx-translate/core'; 

export class SharedPaginatorIntl extends MatPaginatorIntl { 

itemsPerPageLabel = 'Total por página'; 
nextPageLabel  = 'Siguiente Página'; 
previousPageLabel = 'Anterior Página'; 

constructor(private translateService: TranslateService) { 
    super(); 
} 

getRangeLabel = function (page, pageSize, length) { 
    if (length === 0 || pageSize === 0) { 
     return '0 de ' + length; 
    } 
    length = Math.max(length, 0); 
    const startIndex = page * pageSize; 
    // If the start index exceeds the list length, do not try and fix the end index to the end. 
    const endIndex = startIndex < length ? 
     Math.min(startIndex + pageSize, length) : 
     startIndex + pageSize; 
    return startIndex + 1 + ' - ' + endIndex + ' de ' + length; 
}; 
} 

答えて

0

あなたは角度-DIを使用できるように

@Injectable() 

でカスタムPaginatorIntlに注釈を付ける必要があります。

ので、あなたのケースでは、次のようになります。

@Injectable() 
export class SharedPaginatorIntl extends MatPaginatorIntl { 
... 
関連する問題