0

我正在将我的 nativescript 应用程序更新为 Nativescript 7 和最新版本的 Angular (11)。在更改了很多导入之后,我遇到了一些我似乎无法弄清楚的奇怪错误。

src/app/app.component.html:70:29 - error NG8001: 'Image' is not a known element:
1. If 'Image' is an Angular component, then verify that it is part of this module.
2. To allow any element add 'NO_ERRORS_SCHEMA' to the '@NgModule.schemas' of this component.

我已经将 NO_ERRORS_SCHEMA 添加到我的 app.module.ts 的 NgModule.schemas 部分,但仍然无济于事。任何建议或帮助将不胜感激。

import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
...
@NgModule({
declarations: [...],
imports: [...],
providers: [...],
bootstrap: [AppComponent],
schemas: [NO_ERRORS_SCHEMA]
})

包.json

"dependencies": {
        "@angular/animations": "~11.0.2",
        "@angular/cdk": "^11.0.1",
        "@angular/common": "~11.0.2",
        "@angular/compiler": "~11.0.2",
        "@angular/core": "~11.0.2",
        "@angular/forms": "~11.0.2",
        "@angular/material": "^11.0.1",
        "@angular/platform-browser": "~11.0.2",
        "@angular/platform-browser-dynamic": "~11.0.2",
        "@angular/router": "~11.0.2",
        "@nativescript-community/ble": "^3.0.12",
        "@nativescript/core": "7.0.13",
        "@nativescript/angular": "11.0.0",
        "@sentry/node": "^5.27.6",
        "bluebird": "3.7.2",
        "core-js": "^3.8.0",
        "crypto-js": "^4.0.0",
        "hammerjs": "^2.0.8",
        "nativescript-angular-cli": "^0.1.9",
        "nativescript-camera": "^4.5.0",
        "nativescript-imagepicker": "^7.1.0",
        "nativescript-insomnia": "^2.0.0",
        "nativescript-purchase": "^2.0.14",
        "nativescript-sentry": "^2.0.0",
        "nativescript-theme-core": "~2.0.24",
        "nativescript-toasty": "^3.0.0-alpha.2",
        "nativescript-ui-chart": "8.0.2",
        "nativescript-ui-gauge": "7.0.2",
        "nativescript-ui-sidedrawer": "9.0.3",
        "nativescript-urlhandler": "^1.3.0",
        "reflect-metadata": "~0.1.13",
        "rxjs": "~6.6.3",
        "tslib": "^2.0.3",
        "zone.js": "~0.11.3",
        "@nativescript/webpack": "3.0.8"
    },
"devDependencies": {
        "@angular-devkit/build-angular": "^0.1100.2",
        "@angular/cli": "~11.0.2",
        "@angular/compiler-cli": "^11.0.2",
        "@angular/language-service": "~11.0.2",
        "@nativescript/ios": "7.0.6",
        "@nativescript/schematics": "~10.1.0",
        "@ngtools/webpack": "^11.0.2",
        "@types/jasmine": "~3.6.2",
        "@types/jasminewd2": "~2.0.8",
        "@types/node": "~14.14.10",
        "codelyzer": "^6.0.1",
        "extract-text-webpack-plugin": "~3.0.2",
        "jasmine-core": "~3.6.0",
        "jasmine-spec-reporter": "~6.0.0",
        "karma": "~5.2.3",
        "karma-chrome-launcher": "~3.1.0",
        "karma-coverage-istanbul-reporter": "~3.0.3",
        "karma-jasmine": "~4.0.1",
        "karma-jasmine-html-reporter": "^1.5.4",
        "nativescript-dev-typescript": "^0.10.0",
        "ng-packagr": "^11.0.3",
        "node-sass": "^5.0.0",
        "protractor": "~7.0.0",
        "tns-android": "6.5.3",
        "ts-node": "~9.0.0",
        "tslint": "~5.20.1",
        "typescript": "~4.0.2",
        "uglifyjs-webpack-plugin": "^2.2.0"
}

这是我的 app.module.ts NgModule 的更详细信息,但由于隐私原因隐藏了组件的特定名称。

@NgModule({
    declarations: [
        AppComponent,
        LoginComponent,
        ...Component,
        ...Component,
        LoadingComponent,
        ...Component,
        ImageUploaderComponent,
        AdminsComponent,
        UserProfileComponent,
        PasswordResetComponent,
        ForgotPasswordComponent
    ],
    imports: [
        BrowserModule,
        WebMaterialModule,
        MatGridListModule,
        MatSlideToggleModule,
        ComponentsModule,
        HttpClientModule,
        FormsModule,
        ReactiveFormsModule,
        BrowserAnimationsModule,
        AppRoutingModule,
        ErrorHandlerModule
    ],
    providers: [
        { provide: HTTP_INTERCEPTORS, useClass: HttpLoadingInterceptor, multi: true },
        HttpService,
        AppUserStorageService,
        WorkoutDetailService,
        WorkoutHeaderService,
        DocumentService,
        UserService,
        AuthGuardService,
        SentryConfigService,
        LoadingScreenService
    ],
    bootstrap: [AppComponent],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class AppModule { }

这就是我的 app.module.tns.ts 的样子

...

@NgModule({
    bootstrap: [
        AppComponent
    ],
    imports: [
        SentryModule.forRoot({ dsn: environment.sentryDSN }),
        NativeScriptModule,
        NativeScriptUIChartModule,
        NativeScriptUISideDrawerModule,
        NativeScriptUIGaugeModule,
        AppSharedComponentsModule,
        ComponentsModule, // This has an import to CommonModule
        HttpClientModule,
        AppRoutingModule
    ],
    declarations: [
        AppComponent,
        DatePickerComponent,
        DialogComponent,
        AndroidRedirectComponent
    ],
    entryComponents: [
        DialogComponent,
        DatePickerComponent,
        AndroidRedirectComponent,
        ...Component,
        ...Component,
        ...Component,
        ...Component,
        ...Component,
        ...Component,
        ...Component
    ],
    providers: [
        HttpService,
        AppUserStorageService,
        DocumentService,
        UserService,
        ...Provider,
        SentryConfigService,
        NotificationApiService,
        NotificationService,
        VPPViewModelService
    ],
    schemas: [
        NO_ERRORS_SCHEMA
    ]
})
export class AppModule { }
4

0 回答 0