以角度4/5获取URL参数

时间:2018-02-09 14:38:47

标签: angular angular5

我尝试使用GET方法传递URL。

实际上,微控制器正在将GET序列发送到特定的网页。在网站上,我试图获取嵌入在GET序列中的参数,以便进一步存储和处理。 当我直接在chrome中编写目标网址时,它可以使用两种方法:

    this.activatedRoute.queryParams.subscribe((params: Params) => {
    console.log(params);
    this.device_id = params.ID;
    this.Voltage = params.Voltage;
    console.log(this.device_id);
    console.log(this.Voltage);

    this.device_id = this.activatedRoute.snapshot.params['ID'];
    console.log(this.device_id);
    this.Voltage = this.activatedRoute.snapshot.params['Voltage'];
    console.log(this.Voltage);

    });

使用queryParams的第一种方法是我发送此网址时:(http://www.quatuoradbd.com/Reception?ID=00-80-56-de-fr-00-d8-af&Voltage=2650

带有快照的第二种方法是我发送此URL时: (http://www.quatuoradbd.com/00-80-56-de-fr-00-d8-af/2650

当我直接在条形图导航器中传递URL时,这两种方法都有效。

但是当这些URL由微控制器发送时,它不起作用。 我知道它应该有效,因为当我以前的网站版本是用PHP编写的时候,一切都很好。

在Web服务器端,我收到参数(通过参数,我的意思是附加到域名的资源地址):

    if(isset($_GET['Nbres']) OR isset($_GET['Local']))
    {
    $Nbres=$_GET['Nbres'];
    $Local=$_GET['Local'];
    }

但我不明白为什么Angular 4(和5)它不起作用。

在Angular 4中,是否有必须修改的参数?或者这可能来自必须设置的特定路由器参数? ...或服务器上的参数? 如果有人提示,我会很感激。

我加入了我的index.html,我的app-routing.module.ts,如果有帮助的话。

我的index.html

    <!doctype html>
    <html lang="en">
    <head>
       <meta charset="utf-8">
       <title>Connectedfuture</title>
       <base href="/">

       <meta name="viewport" content="width=device-width, initial-scale=1">
       <link rel="icon" type="image/x-icon" href="favicon.ico">
       <script>document.write('<base href="' + document.location + '" />');
       </script>
    </head>
    <body>
      <app-root></app-root>
    </body>
    </html>

我的app-routing.module.ts

    const routes: Routes = [
       { path: '', redirectTo: '/Accueil', pathMatch: 'full' },
       { path: 'ConfirmationCompte/:email', component: 
       ConfirmationCompteComponent },
       { path: 'Graphiques/:id', component: GraphiquesComponent },
       { path: 'Accueil', component: AccueilComponent },
       { path: 'Projets', component: ProjetsComponent },
       { path: 'Clients', component: ClientsComponent },
       { path: 'Histoire', component: HistoireComponent },
       { path: 'Inscription', component: InscriptionComponent },
       { path: 'Identification', component: IdentificationComponent },
       { path: 'Reception/:ID/:Voltage', component: ReceptionComponent },
       { path: 'Reception', component: ReceptionComponent },
       { path: 'Map', component: MapComponent },
       { path: 'App/:ID/:Voltage', component: AppComponent },
       { path: '**', component: InconnuComponent }
    ];
    @NgModule({
      imports: [RouterModule.forRoot(routes)],
      exports: [RouterModule]
    })

0 个答案:

没有答案