如何在 Angular 11 和“@aws-amplify/ui-angular”中刪除“amplify-authenticator 不是已知元素”

Question

在網上四處尋找答案，沒有看到任何東西。 可能是因為這並不難診斷和修復，但我想我會發布這個，以便它可以為其他人節省幾分鍾的時間。

我在使用 AWS Amplify 的 Authenticator 組件時遇到了問題。 按照此處的基本設置-> https://docs.amplify.aws/ui/auth/authenticator/q/framework/angular

一旦我將 Amplify Angular UI 組件添加到我的 app.component.html，我的 IDE 抱怨它無法識別 UI 組件。 文檔中沒有關於如何解決這個問題的內容（與 Amplify 一起使用）。

Answer 1

IDE 抱怨的原因是這些是 web 組件，因此您需要將 CUSTOM_ELEMENTS_SCHEMA 添加到您的模塊

@NgModule({
  declarations: [AppComponent],
  imports: [
    BrowserModule,
    AmplifyUIAngularModule,
    AppRoutingModule,
  ],
  schemas: [CUSTOM_ELEMENTS_SCHEMA], // <---this right here
  providers: [],
  bootstrap: [AppComponent],
})