本文介绍了RouterModule:无法读取未定义的属性"forRoot"的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想从URL获取查询参数.因此,我使用RouterModule来读取查询参数.但是我遇到了错误

I want to get query params from URL. So I used RouterModule to read query params. But I am getting error

我遇到了类似的问题,但就我而言,我没有路线.所有其他问题都使用 RouterModule.forRoot(routes).我在做什么错了?

I went through similar questions but, in my case, I don't have routes.All other questions used RouterModule.forRoot(routes). What am I doing wrong ?

路线3.4.10

这是我的代码. module.js

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { UpgradeModule, downgradeComponent, downgradeInjectable } from '@angular/upgrade/static';
import { LayoutModule } from '@angular/cdk/layout';
import { HttpModule, Http, XHRBackend, RequestOptions } from '@angular/http';
import { RouterModule, Router } from '@angular/router';

import { FlexLayoutModule } from '@angular/flex-layout';
import { Ng2DeviceDetectorModule } from '/thinkshop/angular2plugins/ng2-device-detector/index.ts';

import { ActivateAccountService } from '/thinkshop/widgets2/thinkshopapplication/activateaccount/ActivateAccountService.ts';
import { SupportedDeviceService } '/thinkshop/widgets2/thinkshopapplication/service/supporteddeviceservice/supporteddeviceservice.ts'
import { FormContainerComponent } '/thinkshop/widgets2/thinkshopapplication/component/formcontainer.component.ts'
import { ActivateAccountComponent } from '/thinkshop/widgets2/thinkshopapplication/activateaccount/activateaccount.ts';


const CLIENT_ID = { clientId: "" };
const APP_NAME = 'web-ideolve';
const AUTH_TOKEN = "";
const CAN_EDIT = false;

@NgModule({
  imports: [
    BrowserModule,
    UpgradeModule,
    RouterModule.forRoot(),
    FlexLayoutModule,
    Ng2DeviceDetectorModule.forRoot(),
    HttpModule,
    LayoutModule
  ],

  declarations: [
    FormContainerComponent,
    ActivateAccountComponent
  ],
  entryComponents: [
    FormContainerComponent,
    ActivateAccountComponent
  ],
  providers: [
    Router,
    SupportedDeviceService,
    ActivateAccountService,


    { provide: 'CLIENT_ID', useValue: CLIENT_ID },
    { provide: 'APP_NAME', useValue: APP_NAME },
    { provide: 'AUTH_TOKEN', useValue: AUTH_TOKEN },
    { provide: 'CAN_EDIT', useValue: CAN_EDIT },

  ],
  bootstrap: [FormContainerComponent]
})

export class AppModule {

  showideolvelink = false;

  constructor(private upgrade: UpgradeModule) {
    this.showideolvelink = true;
  }
}

service.ts

import { Injectable, OnInit } from '@angular/core';
import { ActivatedRoute } from '@angular/router';

@Injectable()
export class ActivateAccountService implements OnInit{

    emailId: string= null;

    constructor(private activatedRoute: ActivatedRoute) {
    }

    ngOnInit() : void{
        this.init();
    }

    init(){
        let encodedParams: any = this.activatedRoute.snapshot.params.p;

        if(encodedParams != null ){
            var params= JSON.parse(atob(encodedParams));

            this.emailId=  params.email;
        }
    }

    getEmailId() : string{
        return this.emailId;
    }       
}

推荐答案

您需要像下面那样定义 routes ,然后将它们添加到 RouterModule.forRoot(routes)中.

You need to define routes like following and then add them to RouterModule.forRoot(routes).

import { RouterModule, Routes } from '@angular/router';
import { AppComponent } from './app.component';

//Routes
const routes : Routes = [
{
  path: '',
  component: AppComponent
}
]


@NgModule({
  declarations: [
  // Components
  ],
  imports: [
    BrowserModule,
  RouterModule.forRoot(routes) // You need to add this 
  ],
  providers: [UserService],
  bootstrap: [AppComponent]
})

export class AppModule { }

现在,如果要获取路线参数,则可以使用:在 AppComponent

Now if you want to get route params you can use : In AppComponent

import { RouterModule, Routes ,Router,ActivatedRoute} from '@angular/router';

constructor(private router: Router, private route: ActivatedRoute) { 
      this.route.params.subscribe(params => {
             console.log(params);
      });
}

这篇关于RouterModule:无法读取未定义的属性"forRoot"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

10-14 21:22