0

我有一个导航栏、一个侧边栏和一堆页面。

用户必须登录才能查看。

着陆页上的图表完美显示（URL 以 '' 结尾）。

任何其他页面上的图表都拒绝出现。我已将整个代码从工作组件复制粘贴到非工作组件。没有不同。仍然没有图表出现。

我最近将 HashLocationStrategy 添加到我的项目中。

前段时间 - 在添加此位置策略之前 - 图表适用于所有页面。我不能肯定地说是这个添加打破了图表。我只怀疑它与此添加有关，但是当我删除它时，图表仍然没有显示。所以也许我错了。

我已经在互联网上搜索了几天。我试过调试我自己的项目。任何地方都没有错误。

所以，事不宜迟，这是我的 app.module.ts：

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { ReactiveFormsModule } from '@angular/forms';
import { HttpClientModule, HTTP_INTERCEPTORS } from '@angular/common/http';

// used to create fake backend
import { fakeBackendProvider } from './_helpers';

import { AppRoutingModule } from './app-routing.module';
import { JwtInterceptor, ErrorInterceptor } from './_helpers';
import { AppComponent } from './app.component';
import { AlertComponent } from './_components';
import { HomeComponent } from './home';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { BrowserAnimationsModule } from "@angular/platform-browser/animations";
import { ToastrModule } from 'ngx-toastr';
import { SidebarModule } from './sidebar/sidebar.module';
import { NavbarModule } from './navbar/navbar.module';
import { OverviewComponent } from './pages/overview/overview.component';
import { MapSuburbComponent } from './pages/map-suburb/map-suburb.component';
import { SuburbOverviewComponent } from './pages/suburb-overview/suburb-overview.component';
import { LocationDetailsComponent } from './pages/location-details/location-details.component';
import { SettingsComponent } from './pages/settings/settings.component';
import { SupportComponent } from './pages/support/support.component';
import { AlertsComponent } from './pages/alerts/alerts.component';
import { ChartsModule } from 'ng2-charts';
import { NgApexchartsModule } from 'ng-apexcharts';
import { BillingComponent } from './pages/billing/billing.component';
import { NgCircleProgressModule } from 'ng-circle-progress';
import { HashLocationStrategy, LocationStrategy } from '@angular/common';
import { ShowHidePasswordModule } from 'ngx-show-hide-password';

@NgModule({
    imports: [
        BrowserModule,
        BrowserAnimationsModule,
        ReactiveFormsModule,
        HttpClientModule,
        ChartsModule,
        NgbModule,
        ToastrModule.forRoot(),
        NgApexchartsModule,
        ShowHidePasswordModule,
        SidebarModule,
        NavbarModule,

        NgCircleProgressModule.forRoot({
            // set defaults here
            radius: 100,
            outerStrokeWidth: 10,
            innerStrokeWidth: 10,
            outerStrokeGradient: true,
            outerStrokeColor: '#5bf8d3',
            outerStrokeGradientStopColor: '#5bcef8',
            animationDuration: 400,
            showZeroOuterStroke: true,
            innerStrokeColor: '#f2f3f5',
            backgroundStroke: "transparent",
            showUnits: false,
            space: 10
        }),
        AppRoutingModule

    ],
    declarations: [
        AppComponent,
        AlertComponent,
        BillingComponent,
        HomeComponent,
        OverviewComponent,
        MapSuburbComponent,
        SuburbOverviewComponent,
        LocationDetailsComponent,
        SettingsComponent,
        SupportComponent,
        AlertsComponent

    ],
    providers: [
        [{ provide: LocationStrategy, useClass: HashLocationStrategy }],

        { provide: HTTP_INTERCEPTORS, useClass: JwtInterceptor, multi: true },
        { provide: HTTP_INTERCEPTORS, useClass: ErrorInterceptor, multi: true },

        // provider used to create fake backend
        fakeBackendProvider
    ],
    bootstrap: [AppComponent]
})
export class AppModule { };

我的 sidebar.module.ts：

import { NgModule } from '@angular/core';
import { CommonModule, HashLocationStrategy, LocationStrategy } from '@angular/common';
import { RouterModule } from '@angular/router';
import { SidebarComponent } from './sidebar.component';

@NgModule({
    imports: [ RouterModule, CommonModule ],
    declarations: [ SidebarComponent ],
    exports: [ SidebarComponent ]
})

export class SidebarModule {
    providers: [
        {
          provide: LocationStrategy,
          useClass: HashLocationStrategy,
        }
      ]
}

和我的 navbar.module.ts

import { NgModule } from '@angular/core';
import { CommonModule, HashLocationStrategy, LocationStrategy } from '@angular/common';
import { RouterModule } from '@angular/router';
import { NavbarComponent } from './navbar.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';

@NgModule({
    imports: [ RouterModule, CommonModule, NgbModule ],
    declarations: [ NavbarComponent ],
    exports: [ NavbarComponent ],
    providers: [
        {
          provide: LocationStrategy,
          useClass: HashLocationStrategy,
        }
      ],
})

export class NavbarModule {}

很高兴提供其他任何东西。老实说，甚至不确定什么是完全相关的......整个项目？

我的项目的GitHub 链接。

4

0 回答 0