Размещение изображения и текста с угловым, экспресс и мульти - PullRequest
Новая
       9

Размещение изображения и текста с угловым, экспресс и мульти

0 голосов
/ 11 мая 2018

Я самообучаюсь и чувствую себя не в своей тарелке, когда пытаюсь опубликовать изображения и текст на сервере.Бэкэнд работает как задумано при тестировании с почтальоном, но не работает при работе с угловой.Вот код, который я использовал:

upload.component.html 

<form [formGroup]="uploadForm" (ngSubmit)="onSubmit()">
  <div class="form-group">
    <label for="description">Trip Name</label>
    <input type="text" name="description" class="form-control" formControlName="text" placeholder="description">
  </div>
  <div class="form-group">
    <label for="image">Cover Image</label>
    <input type="file" name="image" class="form-control-file" id="image">
  </div>

  <input type='submit' value="Submit" class="btn btn-primary" />
</form>

upload.component.ts 

private preSubmit(): any {
  let input = new FormData();
  input.append('description', this.uploadForm.get('description').value);
  input.append('image', this.uploadForm.get('image').value);
  return input;
}

onSubmit() {
const newImage = this.preSubmit();
this.http.post('apiUrl', newImage)
}

NodeJS 

router.post('/', multer().single('image'), async (req, res) => {
const upload = {
    imgID: uuidv4(),
    description: req.body.description,
    image: req.file.originalname,
};
postparams = { Key: upload.imgID, Body: req.file.buffer };
await s3Bucket.putObject(postparams, (err, data) => {
    if (err) {
        console.log('Error uploading Image: ', err);
    } else {
        console.log('Image uploaded: ', upload.imgID);
    }
});
knex('image')
    .insert(image).then(images => {
        res.json(images)
    });
});

Спасибо за помощь!

1 Ответ

0 голосов
/ 11 мая 2018

Я не эксперт, но попробуйте это. 

uploadForm: FormGroup;

private preSubmit(): any {
  let input = new FormData();
  input.append('description', this.uploadForm.value.description);
  input.append('image', this.uploadForm.value.image);
  return input;
}

Или это 

private preSubmit(): any {
  return this.uploadForm = new FormGroup ({
    description: new FormControl(),
    image: new FormControl()   }) 
}
...