如何在angular7中插入图片到服务器而不是Base64

在Angular 7中，可以通过以下步骤将图片插入到服务器而不是使用Base64编码：

创建一个表单，用于选择要上传的图片文件。可以使用<input type="file">元素来实现。
在组件中，使用FormData对象来构建表单数据。首先，创建一个空的FormData对象，并使用append()方法将选择的文件添加到表单中。例如：

// 在组件中的方法中处理文件选择事件
onFileSelected(event) {
  const file = event.target.files[0];
  const formData = new FormData();
  formData.append('image', file, file.name);
  
  // 调用上传图片的方法，将formData作为参数传递
  this.uploadImage(formData);
}

创建一个服务来处理图片上传的逻辑。在服务中，使用HttpClient来发送POST请求，将表单数据发送到服务器。例如：

import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable()
export class ImageUploadService {
  constructor(private http: HttpClient) {}

  uploadImage(formData: FormData) {
    return this.http.post('/api/upload', formData);
  }
}

在组件中调用图片上传服务的方法，并处理上传成功或失败的情况。例如：

// 在组件中调用图片上传服务的方法
uploadImage(formData: FormData) {
  this.imageUploadService.uploadImage(formData).subscribe(
    (response) => {
      // 处理上传成功的情况
      console.log('图片上传成功');
    },
    (error) => {
      // 处理上传失败的情况
      console.error('图片上传失败', error);
    }
  );
}

请注意，上述代码中的/api/upload是一个示例的上传图片的API端点，你需要根据你的实际情况进行修改。

这是一个基本的示例，用于在Angular 7中将图片插入到服务器。根据你的具体需求，可能需要进行额外的处理，例如图片压缩、验证等。同时，你还可以使用腾讯云的相关产品来实现图片的存储和管理，例如腾讯云对象存储（COS）服务。你可以参考腾讯云COS的文档来了解更多关于该服务的信息和使用方法。