Javascript 获取当前URL会导致路由器的静态注入器错误

我正在构建一个角度和离子型的应用程序，需要当前页面的URL，浏览器地址栏中显示的URL。为此，我正在使用router.url，但出现了一个错误：

错误：未捕获（承诺中）：错误：StaticInjectorError[路由器]：
StaticInjectorError[路由器]： NullInjectorError:没有路由器的提供程序！错误：StaticInjectorError[路由器]：StaticInjectorError[路由器]： NullInjectorError:没有路由器的提供程序！ 在NullInjector.get（）处 在resolveToken（）处 在tryResolveToken（） 在StaticInjector.get（）处 在resolveToken（）处 在tryResolveToken（） 在StaticInjector.get（）处 在resolveNgModuleDep（）处 在NgModuleRef.get（）处 在resolveDep（）处 在c（） 在Object.reject（）处 在NavControllerBase.\u fireError（） 在NavControllerBase.\u失败（） 在 在t.invoke（）处 在Object.onInvoke（）处 在t.invoke（）处 在r.run（） 在

组件代码为：

import {Component, Pipe, PipeTransform} from '@angular/core';
import {IonicPage, NavController, NavParams, Platform, ViewController, ToastController} from 'ionic-angular';
import {ScreenOrientation} from '@ionic-native/screen-orientation';
import {DomSanitizer, SafeUrl, SafeResourceUrl} from "@angular/platform-browser";
import { ApiProvider } from './../../providers/api/api';
import { Router } from '@angular/router';

@IonicPage()
@Component({
    selector: 'page-play',

    templateUrl: 'play.html',
    providers: [ScreenOrientation]
})

export class PlayPage {

    constructor(platform: Platform,private router: Router, public navCtrl: NavController, public navParams: NavParams, public viewCtrl: ViewController, private screenOrientation: ScreenOrientation, public toastCtrl: ToastController, private sanitizer: DomSanitizer, public apiProvider: ApiProvider) {


this.location=this.router.url;
        console.log("LOCATION"+this.location);
    }
}

我的module.ts是：

import { BrowserModule } from '@angular/platform-browser';
import { ErrorHandler, NgModule, Pipe } from '@angular/core';
import { IonicApp, IonicErrorHandler, IonicModule } from 'ionic-angular';
import { SplashScreen } from '@ionic-native/splash-screen';
import { StatusBar } from '@ionic-native/status-bar';
import { SuperTabsModule } from 'ionic2-super-tabs';
import { MyApp } from './app.component';
import { TabPage } from '../pages/tab/tab';
import {VgCoreModule} from 'videogular2/core';
import {VgControlsModule} from 'videogular2/controls';
import {VgOverlayPlayModule} from 'videogular2/overlay-play';
import {VgBufferingModule} from 'videogular2/buffering';
import { ApiProvider } from '../providers/api/api';
//import { Databaseservice } from '../providers/api/Databaseservice';
import {GetstartedPage} from '../pages/getstarted/getstarted'
import { HttpClientModule } from '@angular/common/http';
import {LoginPage} from '../pages/login/login';
import {LoginPageModule} from '../pages/login/login.module'
import {SongsPage} from '../pages/songs/songs'
import {SongsPageModule} from '../pages/songs/songs.module'
import {VideosPage} from '../pages/videos/videos'
import {VideosPageModule} from '../pages/videos/videos.module'
import {EmbedvideoPage} from '../pages/embedvideo/embedvideo'
import {EmbedvideoPageModule} from '../pages/embedvideo/embedvideo.module'
import {PlayPage} from '../pages/play/play'
import {PlayPageModule} from '../pages/play/play.module'
import {EventsPage} from '../pages/events/events'
import {EventsPageModule} from '../pages/events/events.module'
import {ProfilePage} from '../pages/profile/profile'
import {ProfilePageModule} from '../pages/profile/profile.module'
import {SettingsPage} from '../pages/settings/settings'
import {SettingsPageModule} from '../pages/settings/settings.module'
import {AudioplayertwoPage} from '../pages/audioplayertwo/audioplayertwo'
import {AudioplayertwoPageModule} from '../pages/audioplayertwo/audioplayertwo.module'
import {ViewAllPage} from '../pages/view-all/view-all'
import {ViewAllPageModule} from '../pages/view-all/view-all.module'


import {PricePage} from '../pages/price/price'
import {PricePageModule} from '../pages/price/price.module'
import { GetstartedPageModule } from '../pages/getstarted/getstarted.module';
import { IonicStorageModule } from '@ionic/storage';
import { AngularFireModule } from 'angularfire2';
import * as firebase from 'firebase';
import 'firebase/messaging'; // only import firebase messaging or as needed;
import { firebaseConfig } from '../environment';
import { AngularFireDatabaseModule } from 'angularfire2/database';
import { LocationStrategy, PathLocationStrategy } from '@angular/common';
import { RouterModule,Router } from '@angular/router';



firebase.initializeApp(firebaseConfig);
var database = firebase.database();
//.............
@NgModule({
    declarations: [
        MyApp,
        TabPage,
        // SingleMediaPlayer
    ],


    imports: [
        BrowserModule,
        IonicModule.forRoot(MyApp, {}, {
            links: [
                  { component: LoginPage, name: 'LoginPage', segment: 'login' },
                { component: SongsPage, name: 'SongsPage', segment: 'songs' },
                { component: VideosPage, name: 'VideosPage', segment: 'm/videos' },
                { component: EventsPage, name: 'EventsPage', segment: 'm/events' },
                { component: PlayPage, name: 'PlayPage', segment: 'm/watch/:name' },
                { component: EmbedvideoPage, name: 'EmbedvideoPage', segment: 'embed' },
                { component: ProfilePage, name: 'ProfilePage', segment: 'profile' },
                { component: SettingsPage, name: 'SettingsPage', segment: 'settings' },
                { component: PricePage, name: 'PricePage', segment: 'price' },
                { component: AudioplayertwoPage, name: 'AudioplayertwoPage', segment: 'Audioplayer' },
                { component: TabPage, name: 'TabPage', segment: 'tab' } ,
                 { component: ViewAllPage, name:'ViewAllPage',segment:'m/viewAll/:name'}
            ]
        }),
        SuperTabsModule.forRoot(),
        VgCoreModule,
        VgControlsModule, PlayPageModule, ProfilePageModule, SettingsPageModule, PricePageModule, AudioplayertwoPageModule,
        VgOverlayPlayModule, GetstartedPageModule, LoginPageModule, SongsPageModule, VideosPageModule, EventsPageModule, EmbedvideoPageModule,
        VgBufferingModule, VideosPageModule, HttpClientModule, ViewAllPageModule, AngularFireModule.initializeApp(firebaseConfig), IonicStorageModule.forRoot(), AngularFireDatabaseModule
    ],
    bootstrap: [IonicApp],
    entryComponents: [
        MyApp,
       VideosPage, GetstartedPage
    ],
    providers: [
        StatusBar,
        SplashScreen,
        { provide: ErrorHandler, useClass: IonicErrorHandler }, { provide: LocationStrategy, useClass: PathLocationStrategy }, ApiProvider
    ]
})
export class AppModule { }

---

我知道我必须在module.ts中添加一些内容。但我没弄明白

您必须将

RouterModule

导入您自己的模块

编辑还在第一个构造函数参数中添加访问修饰符：

constructor(public platform: Platform, ...)

---

或者把它放在参数的最后

添加

从'@angular/http'导入{HttpModule}

；Http的app.module.ts中

或

---

从'@angular/common/http'添加

import{HttpClientModule}

在app.module.ts for httpclient中

您必须在模块导入中执行此操作吗

RouterModule.forRoot(
  [
    { path: "", component: PlayPage}
  ]
)

说：

路由角度应用程序有一个路由器服务的单实例

在您配置路由器之前，它没有路由。以下示例创建四个路由定义，通过RouterModule.forRoot方法配置路由器，并将结果添加到AppModule的imports数组中

const批准：路由=[
{路径：“危机中心”，组件：CrisisListComponent}，
{path:'hero/：id'，component:HeroDetailComponent}，
{
路径：'英雄'，
组件：HeroListComponent，
数据：{title:'英雄列表'}
},
{路径：“”，
重定向到：“/heroes”，
路径匹配：“已满”
},
{路径：'**'，组件：PageNotFoundComponent}
];
@NGD模块({
进口：[
RouterModule.forRoot(
批准，
{enableTracing:true}//可能的重复我也导入了
RouterModule
，但同样的问题也存在。构造函数中已经存在：
private router:router
。我也把它作为最后一个参数。这不是我写的。我告诉过你把它放在
平台上
。问题在于路由器，而不是http客户端。而不是vultu通过发布一个类似问题的重复答案，把Malimf这个问题看作是一个重复。我用Mult. TS文件更新了我的问题。我用IonicModule来实现URL的深层链接。