Jak przekonwertować JSON na ciąg zapytania w angular2?

Question

Jestem nowy w Angular2. Mam obiektu JSON, jak poniżej:

var options = { 
    param1: "parama1", 
    param2: "parama2", 
    param3: "parama3" 
}; 

która powinna przekształcić ciąg kwerendy i dołączyć do zewnętrznego URL przekierowania strony jak poniżej:

ngOnInit(){ 
    window.location.href = someurl?param1=param1&param2=param2&param3=param3; 
} 

szukam sposobu na przekonwertuj go na ciąg zapytania. W JQuery dostępne są $.param() i AngularJS $httpParamSerializerJQLike(). Szukałem, ale nie mam nic. Chciałbym wiedzieć, czy jest jakiś sposób, aby to zrobić w kanoncie2.

Answer 1

bardziej „oficjalny” sposób bez concats smyczkowych:

import {URLSearchParams} from '@angular/http' 
let options = { 
    param1: "param1", 
    param2: "param2", 
    param3: "param3" 
}; 

let params = new URLSearchParams(); 
for(let key in options){ 
    params.set(key, options[key]) 
} 

console.log("http://someUrl?" + params.toString()); 

robi to automatyczne kodowanie na drodze.

Answer 2

Jak o tym:

ngOnInit(){ 
    let options = { 
     param1: "param1", 
     param2: "param2", 
     param3: "param3" 
    }; 

    let myQuery = 'http://someurl?' 
    for (let entry in options) { 
     myQuery += entry + '=' + encodeURIComponent(options[entry]) + '&'; 
    } 

    // remove last '&' 
    myQuery = myQuery.substring(0, myQuery.length-1) 

    window.location.href = myQuery; 
} 

myQuery wartość ?param1=param1&param2=param2&param3=param3.

Answer 3

Rozwiązanie to będzie działać z większością typów złożonych

Okrywać ktoś zastanawiałem się, jak to zrobić, mam napisane rozszerzenie, które powinny współpracować z C# .NET 1.1 i rdzenia maszynopis 2.2.2 WebAPI który wygląda tak .

Pamiętaj, aby podać te dwa importu gdzie używasz go jako dobrze

import { URLSearchParams } from '@angular/http'; 
import 'rxjs/add/operator/map' 

export class QueryStringBuilder { 
    static BuildParametersFromSearch<T>(obj: T): URLSearchParams { 
     let params: URLSearchParams = new URLSearchParams(); 

     if (obj == null) 
     { 
      return params; 
     } 

     QueryStringBuilder.PopulateSearchParams(params, '', obj); 

     return params; 
    } 

    private static PopulateArray<T>(params: URLSearchParams, prefix: string, val: Array<T>) { 
     for (let index in val) { 
      let key = prefix + '[' + index + ']'; 
      let value: any = val[index]; 
      QueryStringBuilder.PopulateSearchParams(params, key, value); 
     } 
    } 

    private static PopulateObject<T>(params: URLSearchParams, prefix: string, val: T) { 
     const objectKeys = Object.keys(val) as Array<keyof T>; 

     if (prefix) { 
      prefix = prefix + '.'; 
     } 

     for (let objKey of objectKeys) { 

      let value = val[objKey]; 
      let key = prefix + objKey; 

      QueryStringBuilder.PopulateSearchParams(params, key, value); 
     } 
    } 

    private static PopulateSearchParams<T>(params: URLSearchParams, key: string, value: any) { 
     if (value instanceof Array) { 
      QueryStringBuilder.PopulateArray(params, key, value); 
     } 
     else if (value instanceof Date) { 
      params.set(key, value.toISOString()); 
     } 
     else if (value instanceof Object) { 
      QueryStringBuilder.PopulateObject(params, key, value); 
     } 
     else { 
      params.set(key, value.toString()); 
     } 
    } 

} 

To działa dla wszystkich typów złożonych używałem do tej pory.