Javascript 使用Angular将图像作为表单的一部分上载

我需要一些关于使用AngularJS将图像作为表单的一部分上传的指导。我已经看过一些关于web和stackoverflow的帖子和文章，其中大多数都是自己上传图像，或者不包含Json数据。我的具体情况如下：

• 我在同一表单中有几个字段，希望在用户单击“添加项目”时创建新项目

• 我需要将文件上载到本地目录“/images”，并将URL路径+文件名与表单中创建的其余数据一起发送到API

例如：

• 将文件entry6.jpg放到/images目录中
• 我的代码创建发送到API的以下对象：

  {
  "title": "Big sale",
  "link": "http://www.example.com",
  "image": images/entry6.jpg
  "id": 1
  }
  

你能帮我吗

当前HTML代码：

<div ng-controller="EditClients" class="container">
<form>
  <div class="form-group">
    <label>Title</label>
    <input type="text" ng-model="newClientsItem.title" required="required" class="form-control"/><br/>
    <label>Link</label>
    <input type="url" ng-model="newClientsItem.link" required="required" class="form-control"/><br/>
    <label>Image</label><br/>
    <input type="file" ng-model="newClientsItem.image"/>
   <a ng-click="createClientsItem(newClientsItem)" class="btn btn-default btn-lg">Add</a>
  </div>
</form>

---

我更喜欢使用fornighous（）来处理angular.js和nodejs中的上传文件。

如何将其集成到一个完整的表单中，并在最后发送一个对象？

var app = angular.module('app', ['ui.router', 'ngResource', 'ngTagsInput']);

//constants for APIs
app.constant("clientsUrl", "http://www.example.com:3001/api/clients/");

app.controller('EditClients', function($scope, $http, $resource, clientsUrl) {

    $scope.clientsItemsResource = $resource(clientsUrl + ":id", {id: "@id"},
            { create : { method: "POST"}, save: { method: "PUT"}}
        );

    $scope.listClientsItems = function() {
        $scope.clientsItems = $scope.clientsItemsResource.query();
    };

    $scope.deleteClientsItem = function(clientsItem) {
        if (confirm('Are you sure you to delete this item?')) {
            clientsItem.$delete().then(function () {
                $scope.clientsItems.splice($scope.clientsItems.indexOf(clientsItem), 1);
            });
        }
    };

    $scope.createClientsItem = function (clientsItem) {

        //creates the new item
  new $scope.clientsItemsResource(clientsItem).$create().then(function (newClientsItem) {
      $scope.clientsItems.push(newClientsItem);
    });
};

    $scope.updateClientsItem = function(clientsItem) {
        clientsItem.$save();
        toastr.success('Item sauvé');
    };

    $scope.listClientsItems();

});