如何在Angular 6中将查询字符串传递给我的服务

时间:2018-10-14 08:20:17

标签: angular typescript

我有一个组件可以像这样调用服务:

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $('.c_box').click(function(){                
        if (document.getElementById('c_box').checked) {    
          $('.txt1').hide();          
        }
        else
        { 
          $('.txt1').show();                  
        }
    });
});
</script>
</head>
<body>

<input type="checkbox" id ="c_box" class="c_box"></input>
    
<input type="text" id ="txt1" class="txt1" value="M y  t e x t"></input>

</body>
</html>

该服务使用HttpClient从网站获取数据。现在,我正在服务中使用静态URL进行测试。但是,既然我知道该服务有效并且正在返回结果,我想传递查询字符串以在URL中使用,而不是对其进行硬编码。这可能吗?我的服务包含以下代码:

this.resultService.getResults().subscribe(
      results => {
        this.results = results;
        this.searchResults = results.SearchResults; 
        this.searchResults = this.processResults(this.searchResults);                      
      },
      error => this.errorMessage = <any>error
    );

2 个答案:

答案 0 :(得分:0)

您可以使用``并将变量放在$之内,例如:

getResults(variable:string): Observable<any> {
    let url = `this.baseUrl/admin/user/${variable}` 
    return this.http.get<any>(url, httpOptions).pipe(
      tap(data => console.log('Response Data: ' + JSON.stringify(data))),
      catchError(this.handleError)
    );
  }

答案 1 :(得分:-1)

是的,您可能需要使service方法接受参数,并使用 string literal 将参数传递给服务。

this.resultService.getResults("1234");

您的方法将是

getResults(category:string): Observable<any> {
    //form the url here
    return this.http.get<any>(this.resultsUrl, httpOptions).pipe(
      tap(data => console.log('Response Data: ' + JSON.stringify(data))),
      catchError(this.handleError)
    );
  }