angular - Tilpasse AWS Amplify Cognito påloggings-/registreringskomponent?


I veiledningen - https://medium.com/@nickwang_58849/i-got-the-following-error-after-following-the-steps-82757cfaf9f0, brukes amplify-authenticator fra npm-pakken @aws-amplify/auth for å logge inn og registrere.

auth.component.html har bare én linje,

<amplify-authenticator></amplify-authenticator>

auth.component.ts

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-auth',
  templateUrl: './auth.component.html',
  styleUrls: ['./auth.component.css']
})
export class AuthComponent implements OnInit {
  constructor() { }
  ngOnInit() {
  }
}

Men jeg vil trenge å ha en tilpasset pålogging (må legge til noen nødvendige attributter når jeg registrerer. Og må style påloggings-/registreringskontrollene). Hvordan gjør man det?

Finnes det noe eksempel på at en bruker skriver innloggingsgrensesnittet og bare kaller autentiseringen (via Amplify?) for å logge inn i Cognito?

Svar #1

trenger å style innloggings-/registreringskontrollene. Hvordan gjøre det?

Hvis du bruker de nyeste Amplify-modulene (april 2020), kan du tilpasse utseendet og følelsen ved å bruke CSS:

:root {
  --amplify-primary-color: #008000;
  --amplify-primary-tint: #0000FF; 
  --amplify-primary-shade: #008000;
}

og du kan tilpasse teksten:

<AmplifySignIn headerText="My Custom Sign In Header" slot="sign-in" />
<AmplifySignUp headerText="My Customer Sign Up Header" slot="sign-up" />

Dokumenter: https://aws-amplify.github.io/docs/js/ui-components#customization

Opplæring fra bunnen av: https://aws.amazon.com/blogs/mobile/amplify-framework-announces-new-rearchitected-ui-component-and-modular-javascript-libraries/

Migrering til de nyeste UI-pakkene: https://aws-amplify.github.io/docs/js/ui-components#migration-guide

Svar #2

Jeg synes du bør rette undersøkelsen din på hvordan du tilpasser amplify-authenticator. Ta en titt på dokumentasjonen: https://aws-amplify.github.io/docs/js/angular#signup-configuration

Også kan dette svaret være til hjelp: https://stackoverflow.com/a/53527205/2890724

Relaterte artikler