编码特殊字符问题: API GET请求中忽略的四个参数之一

Question

我具有发送到API的这些动态值(params)，因此在输入中插入格式化文本(大小和颜色)后，可以获得PNG图像：

params = {
    "handwriting_id": "8X3WQ4D800B0",
    "text": "",
    "handwriting_size": "",
    "handwriting_color": "",
  }

前两个是必需的，而不是第三个和第四个。我的问题是，最后一个参数(颜色)被忽略了，其他的不太可能:我得到的图像与我选择的大小和我写的文字，但不是用颜色，总是黑色。这是令人兴奋的HTML：

<mat-form-field class="block center">
    <mat-select placeholder="Choose Color" [(ngModel)]="selectedColor" [(ngModel)]="params.handwriting_color" (change)="changeColor()">
      <mat-option value="#FF0000" selected="selected">Red

      </mat-option>
      <mat-option value="#8c30ec">Blue
      </mat-option>
      <mat-option value="#ec30db">Violet
      </mat-option>

    </mat-select>
  </mat-form-field>

这是带有调用和那些参数的url自定义字符串：

const url = 
      `https://api.handwriting.io/render/png?handwriting_id=${this.params.handwriting_id}&text=${this.params.text}&handwriting_size=${this.params.handwriting_size}&handwriting_color=${this.params.handwriting_color}`;

老实说，我不明白；为什么只有一个对讲机被忽略？任何帮助都会被接受

编辑：

正如@Fateh Mohamed建议我尝试的那样：

params = {
    "handwriting_id": "8X3WQ4D800B0",
    "text": "",
    "handwriting_size": "",
    "handwriting_color": "",
  }
  color = encodeURIComponent(this.params.handwriting_color);

然后把它传递给网址：

const url = 
      `https://api.handwriting.io/render/png?handwriting_id=${this.params.handwriting_id}&text=${this.params.text}&handwriting_size=${this.params.handwriting_size}&handwriting_color=${this.color}`;

但还是没有结果..。

Answer 1

请使用：

encodeURIComponent(uri);

编码特殊字符