在我的Ionic应用程序中,我实现了默认指令,该指令为您提供了我需要的所有注册/登录表单。
唯一的是我喜欢翻译所有字符串 根据Amplify文档,可以使用i18n模块: https://aws-amplify.github.io/docs/js/i18n
所以在我的home.page.ts中,我有
....
import { I18n } from '@aws-amplify/core';
@Component({
selector: 'app-page-home',
templateUrl: 'home.page.html',
styleUrls: ['home.page.scss']
})
export class HomePage implements AfterContentInit {
authState: any;
signUpConfig: any;
// including AuthGuardService here so that it's available to listen to
auth events
authService: AuthGuardService;
amplifyService: AmplifyService;
constructor(
public events: Events,
public guard: AuthGuardService,
public amplify: AmplifyService,
) {
this.authState = { loggedIn: false };
this.authService = guard;
this.amplifyService = amplify;
this.amplifyService.authStateChange$.subscribe(authState => {
this.authState.loggedIn = authState.state === 'signedIn';
this.events.publish('data:AuthState', this.authState);
});
const dict = {
'nl': {
'Sign In': 'Inloggen',
'Sign Up': 'Account aanmaken',
'No account?': 'Geen account?'
}
};
I18n.putVocabularies(dict);
I18n.setLanguage('nl');
this.signUpConfig = {
header: 'Welkom!',
hideAllDefaults: true,
signUpFields: [
{
label: 'Gebruikersnaam',
key: 'username',
required: true,
displayOrder: 1,
type: 'string',
},
{
label: 'Wachtwoord',
key: 'password',
required: true,
displayOrder: 2,
type: 'password',
},
{
label: 'Email',
key: 'email',
required: true,
displayOrder: 3,
type: 'email',
}
]
};
}
ngAfterContentInit() {
this.events.publish('data:AuthState', this.authState);
}
}
目前此操作无效。
在home.page.html中,我实现了该指令,但是它如何知道I18N类的存在?
<amplify-authenticator framework="ionic" [signUpConfig]="signUpConfig"></amplify-authenticator>