显示在帆中上传图像的问题

时间:2016-04-04 10:36:19

标签: javascript angularjs express sails.js

  add:function (req, res)
  {
    Airline.create({
      name:req.param('name'),
      email:req.param('email'),
      office:req.param('office'),
      phone:req.param('phone')
    },
      function airlineCreated(err, newAirline)
    {
      if(err)
      {
        console.log('Error: '+err);
        return res.negotiate(err);
      }
      else
      {
        console.log('uploading file');
        req.file('file').upload({
          maxBytes: 10000000,
          dirname: '../../assets/images/'
        },
          function whenDone(err, uploadedFiles)
          {
          if (err)
          {
            console.log(err);
            return res.negotiate(err);
          }

          // If no files were uploaded, respond with an error.
          if (uploadedFiles.length === 0)
          {
            console.log("No file");
            return res.badRequest('No file was uploaded');
          }


          // Save the "fd" and the url where the avatar for a user can be accessed
          Airline.update(newAirline.id,
            {

              // Generate a unique URL where the avatar can be downloaded.
              logoUrl: require('util').format('%s/airline/logo/%s', sails.getBaseUrl(), newAirline.id),

              // Grab the first file and use it's `fd` (file descriptor)
              logoFd: uploadedFiles[0].fd
            })
            .exec(function (err)
            {
              if (err)
              {
                return res.negotiate(err);
                console.log(err);
              }

              return res.ok();
            });

        });

      }

    });

  }

我学习风帆并且在上传和检索图片时遇到问题。我按照文档并上传工作,代码在上面。以下是图片上传后我的数据的json格式。

 {
    "name": "imager",
    "email": "i@m.com",
    "office": "img",
    "phone": "24232",
    "createdAt": "2016-04-04T09:06:35.404Z",
    "updatedAt": "2016-04-04T09:06:35.438Z",
    "id": 11,
    "logoUrl": "http://localhost:1337/airline/logo/11",
    "logoFd": "/Users/musaddiq/Desktop/Other proples companies/AirportAngular/airport/assets/images/6bd339f5-bc72-458c-b04c-6670bc1b59a5.jpg"
  }

我所拥有的是带有图像的个人列表,我有一个表格视图,我想用所有用户显示他们的徽标。以下是我的表格视图。我不知道怎么做,使用风帆文档并不适合我。

<div style="padding-top: 180px;" ng-app="airlineMod" ng-controller="airlineCtrl" class="container">
  <div ng-init="airlineList()">

    <table class="table table-responsive table-hover">
      <thead>
       <tr>
         <td>
           Logo
         </td>
         <td>
          Name
         </td>
         <td>
           Office
         </td>
         <td>
          Email
        </td>
         <td>
          Phone Number
        </td>
       </tr>
      </thead>
      <tbody ng-repeat="airline in airlines">
          <tr>
            <td>
             <img ng-src="{{airline.logoUrl}}" class="img-responsive img-circle" width="50" height="50">
            </td>
            <td>
              {{airline.name}}
            </td>
            <td>
              {{airline.office}}
            </td>
            <td>
              {{airline.email}}
            </td>
            <td>
              {{airline.phone}}
            </td>
          </tr>
      </tbody>
    </table>

  </div>
</div>

以下是我尝试使用的代码来获取图像

 getAll:function (req, res)
  {
    Airline.find({},
      function found(err,airlines)
      {
        if(err)
        {
          return res.negotiate(err);
        }

        console.log("Airlines found");


       var SkipperDisk = require('skipper-disk');
        var fileAdapter = SkipperDisk(/* optional opts */);

        _.each(airlines,function (airline)
        {
          fileAdapter.read(airline.logoFd)
            .on('error', function (err)
            {
              return res.serverError(err);
            })
            .pipe(res);
        }); 

        return res.send(airlines);
      });
  }

我一直收到错误&#34; fs.js:262 binding.open(pathModule._makeLong(path),TypeError:path必须是字符串&#34;。

1 个答案:

答案 0 :(得分:0)

  add:function (req, res)
  {
    Airline.create({
      name:req.param('name'),
      email:req.param('email'),
      office:req.param('office'),
      phone:req.param('phone')
    },
      function airlineCreated(err, newAirline)
    {
      if(err)
      {
        console.log('Error: '+err);
        return res.negotiate(err);
      }
      else
      {
        console.log('uploading file');
        req.file('file').upload({
            maxBytes: 10000000,
            dirname: '../../assets/images',
            saveAs : _saveAs
        },
          function whenDone(err, uploadedFiles)
          {
          if (err)
          {
            console.log(err);
            return res.negotiate(err);
          }

          // If no files were uploaded, respond with an error.
          if (uploadedFiles.length === 0)
          {
            console.log("No file");
            return res.badRequest('No file was uploaded');
          }

          Airline.update(newAirline.id,
            {

              logoUrl: require('util').format('%s/images/%s', sails.getBaseUrl(),uploadedFiles[0].filename)

          })
            .exec(function (err)
            {
              if (err)
              {
                return res.negotiate(err);
              }

              return res.ok();
            });

        });

        function _saveAs(file, cb)
        {
          var newName = file.filename;
          return cb(null, newName);
        }

      }

    });

  }

我只是将自动生成的文件的名称更改为originl文件名,然后用它来保存logoUrl,然后我从我的前端引用