我正在将我的 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 { }