Angular2获取url查询参数

7 回答

• 15

  您正在寻找 ActivatedRoute 的query parameters .

  要接收它们，您可以将它们放入组件的 OnInit 函数中，如下所示：

  private accesstoken;
  private code;
  
  constructor(private route: ActivatedRoute) { }
  
  ngOnInit() {
    // Capture the access token and code
    this.route
        .queryParams
        .subscribe(params => {
            this.accesstoken = params['#access_token'];
            this.code = params['code'];
        });
  
    // do something with this.code and this.accesstoken
  }
  

  我在上面的链接中有更多的例子 . 您可能遇到角度问题，因为路由器还识别了以＃开头的片段...如果angular确实将其识别为片段，那么您可以从 ActivatedRoute 订阅可观察的片段并按此方式执行 .

  我被重定向了 . 如果你是，可以考虑使用 preserveQueryParams 导航选项，类似这样 .

  this.router.navigate([redirect], {preserveQueryParams: true});
  

  回复于 2024-06-02T13:23:43+08:00
• 28

  这是我最后的工作代码：

  进口：

  import { Router, NavigationCancel } from '@angular/router';
  import { URLSearchParams, } from '@angular/http';
  

  构造函数：

  constructor(public router: Router) {
      router.events.subscribe(s => {
        if (s instanceof NavigationCancel) {
          let params = new URLSearchParams(s.url.split('#')[1]);
          let access_token = params.get('access_token');
          let code = params.get('code');
        }
      });
    }
  

  回复于 2024-06-02T13:23:43+08:00
• 0

  使用Javascript：

  (new URL(location)).searchParams.get("parameter_name")
  

  回复于 2024-06-02T13:23:43+08:00
• 4

  getQueryParams( locationSearch: string):any {
      let params = {};
      if( locationSearch ) {
          locationSearch = locationSearch.split('?')[1];
          let splited = locationSearch.split('&');
          for( let i = 0; i < splited.length; i++ ) {
              let propName = splited[i].split('=')[0];
              let propValue = splited[i].split('=')[1];
              params[propName] = propValue;
          }
      }
  
      return params;
  }
  
  let q = getQueryParams( location.search );
  

  回复于 2024-06-02T13:23:43+08:00
• 1

  这适合我！ :)

  import { ActivatedRoute } from '@angular/router'; 
  
  constructor(private route: ActivatedRoute) { }
  
  /** usage in the method */
  let projectId = this.route.snapshot.queryParams.projectId;
  

  回复于 2024-06-02T13:23:43+08:00
• -1

  在this帖子中查看我的答案 .

  [更新]似乎有些主持人删除了我的答案，说这是重复的答案 . 但我不同意，因为我根据每个问题发布了相关的代码片段 . 在此答案未被删除之前，我再次在此处发布部分答案 . 如果您同意，请投票取消删除我的答案 .

  ---

  使用 window.location.hash 访问从＃开始的所有参数 . 或者您可以使用 window.location.href 访问完整的URL . 要获得令牌，您可以使用 window.location.hash.match(/#access_token=([^&]+)/)[1] .

  注意：如果您使用的是TypeScript，则需要在组件中导入窗口 .

  declare let window;
  

  ---

  回复于 2024-06-02T13:23:43+08:00
• 2

  你试过这个吗？

  import { Params, Router } from '@angular/router';
  
  
       constructor(private router: Router) {
  
              this.route.params.forEach((params: Params) => {
              //here you can get your params
              let param = params['parameterName'];
  
  
              })
          }
  

  回复于 2024-06-02T13:23:43+08:00