angular - 如何从 Angular 4的url获取参数?

标签 angular

我正在尝试从 URL 获取开始日期。 URL 看起来像 http://sitename/booking?startdate=28-08-2017

我的代码如下:

aap.module.ts

    import {...};

    @NgModule({
      declarations: [
        AppComponent, ModalComponent
      ],
      imports: [
        BrowserModule,
        FormsModule,
        HttpModule,
        JsonpModule,
        ReactiveFormsModule,
        RouterModule.forRoot([{
                path: '',
                component: AppComponent
            },
        ]),    
      ], 
      providers: [ContactService, AddonService, MainService],
      bootstrap: [AppComponent]
    })
    export class AppModule { }

aap.component.ts

import {...}
import {Router, ActivatedRoute, Params} from '@angular/router';

constructor(private activatedRoute: ActivatedRoute) {
  // subscribe to router event
  this.activatedRoute.queryParams.subscribe((params: Params) => {
    console.log(params);
  });

}

但它给出了以下错误

Unhandeled Promise rejection: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document. ; Zone: ; Task: Promise.then ; Value: Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.

Angular 如何知道基础 href?

最佳答案

路线

export const MyRoutes: Routes = [
    { path: '/items/:id', component: MyComponent }
]

组件

import { ActivatedRoute } from '@angular/router';
public id: string;

constructor(private route: ActivatedRoute) {}

ngOnInit() {
   this.id = this.route.snapshot.paramMap.get('id');
}

关于angular - 如何从 Angular 4的url获取参数?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45997369/

相关文章:

angular - 是否可以在 Angular 中同时将输入绑定(bind)到两个变量?

angular - 更新 Angular 后无法在 Chrome 中调试 typescript 文件

angular - 调用受B2C保护的Function App API的Angular应用接收500,Function接收404

angular - "CORS request did not succeed"尽管为 Nginx、angular-http-server 和 Golang 启用了它

angular - 具有外观轮廓的 mat-form-field 效果不佳

angular - *ngFor中输入无法顺利打字Angular 2

javascript - Angular 2/4 : call function for each row in NgFor

typescript - Angular2 中的动态模板 "transclusion"

javascript - Angular 从子组件更新 UI 将值反射(reflect)到父组件

angular - 在 Nx + Angular monorepo 架构中,我应该在哪里放置特定于一个库的测试助手?