Как отправить ngTagsInput с помощью multipart-формы в angularjs

Question

В моем приложении angularjs я использую плагин ngTagsInput для получения тегов от пользователя. И хотите отправить эти теги, некоторые поля и один файл (изображение или видео) на стороне сервера,

СТОРОНА КЛИЕНТА

HTML

<div class="main-wrapper" ng-controller="HomeController">
  <input vs-google-autocomplete="locOptions" ng-model="place" name="ccity" type="text" size="25">
  <tags-input ng-model="post.tagList" add-on-paste="true" style="width:200px">
    <auto-complete min-length="1" source="loadTags($query)"></auto-complete>
  </tags-input>
  <input type="file" name="file" file-model="post.file"/>
  <button ng-click="submitPost()" class="btn btn-sm btn-primary mr-2">Post</button>
</div>

app.js

var app = angular.module('App',['ngTagsInput']);

// controller
app.controller('HomeController', ['$scope', 'pservice', function ($scope, pservice) {
    $scope.submitPost = () => {        
        console.log($scope.post.tagList);
        $scope.post.place = $scope.place; 
        var data = $scope.post;       
        pservice.add(data, '/p/add');  //service called sending data and url 
    };  
}]);

//directive
app.directive('fileModel', ['$parse', function ($parse) {
    return {
        restrict: 'A',
        link: function (scope, element, attrs) {
            var model = $parse(attrs.fileModel);
            var modelSetter = model.assign;
            element.bind('change', function () {
                scope.$apply(function () {
                    modelSetter(scope, element[0].files[0]);
                });
            });
        }
    };
}]);

//service
app.service('pservice', ['$http',  function ($http) {

    this.add = function (data, uploadUrl) {                         

            var fd = new FormData();
            angular.forEach(data.file, function (file) {
                fd.append("file", file);
            });           
            for (var key in data) {                
                fd.append(key, data[key]);
            } 
            $http({
                method: 'POST',
                url: uploadUrl,
                transformRequest: angular.identity,
                headers: {
                    'Content-Type': undefined
                },
                data: fd
            }).then(function successCallback(response) {
                console.log(response.data);               
            }, function errorCallback(response) {
                console.error(response);
            });
    };

}]);

Консоль браузера

[{"id":"1","text":"Pink"},{"id":"2","text":"Red"}]

СЕЙЧАС СЕРВЕРНАЯ СТОРОНА

NodeJS на стороне сервера.

multer для обработки файлов.

const express = require('express');
const router = express.Router();
const multer = require('multer');
const path = require('path');
const bodyParser = require('body-parser');
app.use(bodyParser.json({
    limit: '5mb'
}));
app.use(bodyParser.urlencoded({
    extended: true
}));

var storage = multer.diskStorage({
    destination: 'media/',
    filename: function (req, file, cb) {
        cb(null, path.extname(file.originalname))
    }
})

var upload = multer({
    storage: storage
}) 



app.post('/p/add', upload.single('file'), (req, res, next) => {

    console.log(req.body.tagList);  // <========

    res.status(200).json({
        msg:'It's ok'
    });

});

некоторые моменты,

• Я отправил с файлом и некоторыми данными, поэтому я использую multipart/form-data
• плагин multer работает правильно, файл сохраняется на стороне сервера.

проблема,

Я пытаюсь получить req.body.tagList он возвращает (два тега со стороны клиента)

[object Object],[object Object]

Я хочу получить эти теги и сохранить в базу данных, один за другим. Но я не понимаю, как это сделать.

ПОЖАЛУЙСТА ПОМОГИ