在Angular4中使用Imgur API

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

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

@Injectable()
export class ImgurService {
  private apiUrl = 'https://api.imgur.com/3';

  constructor(private http: HttpClient) { }

  uploadImage(imageData: FormData) {
    const clientId = 'YOUR_CLIENT_ID'; // 替换为你的Imgur API客户端ID
    const url = `${this.apiUrl}/image`;

    return this.http.post(url, imageData, {
      headers: {
        Authorization: `Client-ID ${clientId}`
      }
    });
  }
}

<input type="file" (change)="onFileSelected($event)">

import { Component } from '@angular/core';
import { ImgurService } from './imgur.service';

@Component({
  selector: 'app-root',
  template: `
    <input type="file" (change)="onFileSelected($event)">
    <button (click)="uploadImage()">Upload</button>
  `,
  providers: [ImgurService]
})
export class AppComponent {
  private selectedFile: File;

  constructor(private imgurService: ImgurService) { }

  onFileSelected(event: any) {
    this.selectedFile = event.target.files[0];
  }

  uploadImage() {
    const imageData = new FormData();
    imageData.append('image', this.selectedFile);

    this.imgurService.uploadImage(imageData)
      .subscribe(response => {
        console.log(response);
      });
  }
}