将可选的查询字符串参数传递给 http 服务调用

Question

我需要进行一个 API 调用，它允许我传递可选的查询参数

 retrieveConts(param1:string,param2?:string):Observable<IContracts> {  
  this.basePath =  "/myConts"; 
      return http.get(this.basePath,{ 
      params: {  
       arg1:param1,
       arg2:param2,
      },
      withCredentials: false
    }) 
     .catch(this._errorHandler); 
  }

使用上面的代码 spinet，我已经将 param2 声明为可选参数，可以或不能传递给服务调用，但是如果 param2 没有值，那么它 returns undefined这是可以理解的。

如果没有从 param2 变量返回值，我如何调用服务来忽略 "arg2" 参数？

Answer 1

你可以这样做：

retrieveConts(param1:string,param2?:string):Observable<IContracts> {  
    this.basePath =  "/myConts"; 
    let params = {arg1: param1};
    if (param2)
        params = {arg1: param1, arg2: param2};

    return http.get(this.basePath, { 
        params: params,
        withCredentials: false
    }) 
    .catch(this._errorHandler); 
}

希望对您有所帮助！

Answer 2

切换到对象定义以缩短您的代码（其他解决方案会使其更长）：

retrieveConts(params: { [key: string]: value: string }) {
  return http
    .get('/myConts', { 
      params,
      withCredentials: false
    }) 
    .catch(this._errorHandler); 
}

参数被声明为一个对象，可以有一个字符串键和一个字符串值，你直接把它作为你的URL的参数传递（同名的属性不需要写了两次）

Answer 3

您可以传递一个对象，而不是在组件中传递两个值

//假设userService是你的服务 // 组件中的代码

userService.retrieveConts({arg1:"val1",arg2:"val2"})

// userService中的代码

retrieveConts(param:any):Observable<IContracts> {  
  this.basePath =  "/myConts"; 
      return http.get(this.basePath,{ 
      params: param,
      withCredentials: false
    }) 
     .catch(this._errorHandler); 
  }

或者您也可以检查 param2 并将其附加到对象

retrieveConts(param1:string,param2?:string):Observable<IContracts> {  
    this.basePath =  "/myConts"; 
    let params = {arg1: param1};
    if (param2) params.arg2 = param2;

        return http.get(this.basePath, { 
            params: params,
            withCredentials: false
        }) 
        .catch(this._errorHandler); 
    }

或传递空值，如果 param2 未定义或为空

retrieveConts(param1:string,param2?:string):Observable<IContracts> {  
        this.basePath =  "/myConts"; 

            return http.get(this.basePath, { 
                params: {arg1: param1, arg2: param2 || ''},
                withCredentials: false
            }) 
            .catch(this._errorHandler); 
        }

或

  retrieveConts(param1:string,param2?:string=""):Observable<IContracts> {
           this.basePath =  "/myConts"; 

            return http.get(this.basePath, { 
                params: {arg1: param1, arg2: param2},
                withCredentials: false
            }) 
            .catch(this._errorHandler); 
        }

Answer 4

您可以尝试这样的操作：

retrieveConts(p1,p2?): Observable<IContracts> {
    this.basePath =  "/myConts";
    let params = {argument1: p1};
    if (p2)
        params = {argument1: p1, argument2: p2};

    return http.get(this.basePath, {
        params: params,
        withCredentials: false
    })
    .catch(this._errorHandler);
 }

Answer 5

我建议进行一项小改动：而不是：

    this.basePath =  "/myConts"; 
    let params = {arg1: param1};
    if (param2) params.arg2 = param2;

        return http.get(this.basePath, { 
            params: params,
            withCredentials: false
        }) 
        .catch(this._errorHandler); 
    }

我会做：

        this.basePath =  "/myConts"; 
    let params = {arg1: param1};
    if (param2) params['arg2'] = param2;

        return http.get(this.basePath, { 
            params: params,
            withCredentials: false
        }) 
        .catch(this._errorHandler); 
    }

这样做可以避免 Angular 中的编译错误。

Answer 6

您可以尝试这样的操作：

retrieveConts(param1:string,param2?:string):Observable<IContracts> {  
     var params = {arg1:param1};

     if(param2){
         params = Object.assign(params,{arg2:param2})
     }

     this.basePath =  "/myConts"; 
         return http.get(this.basePath,{ 
         params: params,
         withCredentials: false
     }).catch(this._errorHandler); 
 }

将可选的查询字符串参数传递给 http 服务调用

passing optional query string parameters to http service call

angular

angular-httpclient

angular5