Question

我尝试升级到最新的Angular，但我的组件出现错误并转到URL / login

它是这样的： 错误错误：“未捕获（承诺）：错误：无法解析LocalStorageService的所有参数：（？）。

我的pages / login / login.component像这样：

.AddCustom

以及在页面/login/login.module上

import { Component, OnInit } from "@angular/core";
import { LocalStorageService } from "ngx-webstorage";
import { Router } from "@angular/router";
import { NgForm } from "@angular/forms";
import {
  SnotifyService,
  SnotifyPosition,
  SnotifyToastConfig
} from "ng-snotify";

import { AuthenticationService } 
  constructor(
    private authenticationService: AuthenticationService,
    private router: Router,
    private localStorageService: LocalStorageService,
    private snotifyService: SnotifyService
  ) {}

在我的app.module上是这样的

import { NgModule } from "@angular/core";
import { RouterModule, Routes } from "@angular/router";
import { CommonModule } from "@angular/common";
import { LoginComponent } from "./login.component";
import { AuthService } from "../../../services/base-services/auth.service";
import { AuthenticationService } from "../../../services/authentication.service";
import { SnotifyModule, SnotifyService, ToastDefaults } from "ng-snotify";
import { FormsModule } from "@angular/forms";
import { LocalStorageService } from "ngx-webstorage";

export const LoginRoutes: Routes = [
  {
    path: "",
    data: {
      breadcrumb: "Login"
    },
    children: [
      {
        path: "",
        component: LoginComponent,
        data: {
          breadcrumb: "Login"
        }
      }
    ]
  }
];

@NgModule({
  declarations: [LoginComponent],
  imports: [
    CommonModule,
    RouterModule.forChild(LoginRoutes),
    SnotifyModule,
    FormsModule
  ],
  providers: [
    LocalStorageService,
    AuthenticationService,
    AuthService,
    SnotifyService,
    { provide: "SnotifyToastConfig", useValue: ToastDefaults }
  ]
})
export class LoginModule {}

在我的文件上导入和放置服务有什么问题吗？或我的组件上缺少任何语法??

我的 package.json

import { BrowserModule } from "@angular/platform-browser";
import { NgModule } from "@angular/core";
import { AuthComponent } from "./layout/auth/auth.component";
import { HttpClientModule } from "@angular/common/http";
import { AuthGuardService } from "./services/base-services/auth-guard.service";
import { AuthenticationService } from "./services/authentication.service";
import { BreadcrumbsComponent } from "./layout/admin/breadcrumbs/breadcrumbs.component";
import { FormsModule } from "@angular/forms";

import { AppRoutingModule } from "./app-routing.module";
import { AppComponent } from "./app.component";

@NgModule({
  declarations: [AppComponent, AuthComponent, BreadcrumbsComponent],
  imports: [BrowserModule, AppRoutingModule, FormsModule, HttpClientModule],
  providers: [AuthGuardService, AuthenticationService],
  bootstrap: [AppComponent]
})
export class AppModule {}

Answer 1

您的LocalStorageService有一个未满足的依赖项。您需要将该依赖项添加到login.module中。

如您所说； LocalStorageService是一个外部软件包。

也许您应该providing所属的LocalStorageService而不是import Module自己。可能是LocalStorageModule，您可以考虑将其放在app.module中，以便可以provide将服务提供给本地作用域的模块。

编辑：根据他们的自述文件：

https://www.npmjs.com/package/ngx-webstorage

import {NgxWebstorageModule} from 'ngx-webstorage';

@NgModule({
    declarations: [...],
    imports: [
        ...,
        NgxWebstorageModule.forRoot(),
        ...
    ]
})

然后，您不必自己提供service，只需在constructor()中使用它，它就会被注入。

Answer 2

似乎TypeError: Cannot read property 'orient' of undefined尚不支持Angular8.x.x。已经有pull request on github可以更改它。只要您在浏览器中运行该应用程序，我什么都别想。

Answer 3

在任何组件中使用localStorageService之前，需要将其模块导入AppModule或LoginModule。

  LocalStorageModule.forRoot({
     prefix: 'my-app',
     storageType: 'localStorage'
  })

未捕获（承诺）：错误：无法解析LocalStorageService的所有参数

3 个答案: