動態形成的HTTP請求

我需要發送GET請求，這樣對我的API：動態形成的HTTP請求

http://test.example.com/api/activity/search?word={word}&age={age}&free={free}

，然後在我的頁面顯示此活動* ngFor，但是當用戶填寫的投入，我需要動態插入值在這個不必要的論據。什麼，我已經做了：

//activity.service.ts : 
    searchActivities(word?: any, age?: any, free?: any) { 
    let w, a, f; 
//contat values from forms here 
    w = word  ? `word=${word}` : ''; 
    a = age  ? `age=${age}` : ''; 
    f = free  ? `free=${free}` : ''; 

    return this.http.get(`http://test.example.com/api/activity/search?${w}${a}${f}`); 
}

，你注意到了，我錯過這裏＆符號，而當用戶想看到所有免費的足球活動，他不能就只能與一個輸入，例如。

在我的部分，我有這樣的：輸入

activities = []; 
args: any[] = [null, null, null]; //array for values 
//funtction attached to input's events 
setArgument(index, value) { 
     this.args[index] = value; //fills array with values from inputs 
     this.activityService 
    // spread operator gives error in typescript for some reason, so i decided to put arguments this way 
     .searchActivities(this.args[0], this.args[1], this.args[2]) 
     .subscribe((data: Response) => this.activities = data.json()); 
    }

例如：

<md-checkbox (click)="setArgument(5, !IsFree)" [(ngModel)]="IsFree" name="free">Free</md-checkbox> 
<md-input-container> 
    <input (focusout)="setArgument(0, word)" [(ngModel)]="word" name="word" mdInput placeholder="Search word"> 
</md-input-container>

我希望你明白我想要做的，我在編程的新手，也許我這樣做完全不好。請指點我怎麼處理＆符號，也許簡化或重寫這段代碼莫名其妙

來源

2017-05-25 Oleg Burdasov

https://angular.io/docs/ts/latest/guide/server-communication.html#!#search-parameters（當然，這也適用於Http服務，不僅適用於Jsonp服務）。 –

非常感謝，這就是我一直在尋找，但無法找到並開始寫這個可怕的代碼._。 –

很好的解決你的符號問題就Array.prototype.join

所以，你可能會添加類似下面的代碼：

w = word  ? `word=${word}` : ''; 
a = age  ? `age=${age}` : ''; 
f = free  ? `free=${free}` : ''; 

q = [w, a, f].filter(function(x) { return x !== '' }).join('&'); 

return this.http.get(`http://test.example.com/api/activity/search?${q}`);

因此，您創建一個包含所有查詢字符串的數組，其中包含所有查詢字符串，filter，其中包含空白的字符串，並將它們連接在一起形成一個以＆符號分隔的字符串。

來源

2017-05-25 05:53:18

有幫助！謝謝：） –

動態形成的HTTP請求

回答

相關問題