loopback-storage-component 如何显示图片-文件
loopback-storage-component how to display picture - file
我正在使用 loopback-component-storage 将图像上传到服务器。
https://docs.strongloop.com/display/public/LB/Storage+component
我也有 AngularJS JavaScript SDK，所以我的 lb-services.js 是动态更新的。
https://docs.strongloop.com/display/public/LB/AngularJS+JavaScript+SDK
现在我想在我的网页上显示来自这个环回组件存储模型（称为容器）的照片，这样我就可以在我的 angular 控制器方法中使用 getFile（来自 lb-service），"Get information for specified file within specified container." 像那样：
$scope smthing = Container.getFile({container: 'news-imgs', file: 'smallpic.pnh'})
或者我可以使用方法下载，"Download a file within specified container." 像这样：
$scope smthing = Container.download({container: 'news-imgs', file: 'smallpic.png'})
在我的控制器中。
现在，问题是，当我将写入 .html 文件时 {{smthing}}，第一个方法将显示给我
{
"container": "news-imgs",
"name": "smallpic.png",
"size": 757,
"atime": "2015-12-01T11:49:36.840Z",
"mtime": "2015-12-01T11:49:36.840Z",
"ctime": "2015-12-01T11:49:36.840Z"
}
而第二种方法会显示出很多悲伤的迹象，像这样：
"0":"�","1":"P","2":"N","3":"G","4":"\r","5":"\n","6":"\u001a","7":"\n","8":"\u0000","9":"\u0000","10":"\u0000","11":"\r","12":"I","13":"H","14":"D","15":"R","16":"\u0000","17":"\u0000","18":"\u0000","19":"\u0014","20":"\u0000","21":"\u0000","22":"\u0000","23":"\u0012","24":"\b","25":"\u0003","26":"\u0000","27":"\u0000","28":"\u0000","29":"l","30":"\u000e","31":"\u000e","32":"\"","33":"\u0000","34":"\u0000","35":"\u0000","36":"\u0019","37":"t","38":"E","39":"X","40":"t","41":"S","42":"o","43":"f","44":"t","45":"w","46":"a","47":"r","48":"e","49":"\u0000","50":"A","51":"d","52":"o","53":"b","54":"e","55":" ","56":"I","57":"m","58":"a","59":"g","60":"e","61":"R","62":"e","63":"a","64":"d","65":"y","66":"q","67":"�","68":"e","69":"<","70":"\u0000","71":"\u0000","72":"\u0001","73":"�","74":"P","75":"L","76":"T","77":"E","78":"�","79":"�","80":"�","81":"�","82":"�","83":"�","84":"�","85":"\u0000","86":"r","87":"�","88":"�","89":"�","90":"�","91":"\u0000","92":"�","93":"�","94":"\u0000","95":"~","96":"�","97":"�","98":"�","99":"�","100":"\u0000","101":"x","102":"�","103":"\u0012","104":"�","105":"�","106":"\u0000","107":"","108":"�","109":"\t","110":"�","111":"�","112":"\u0016","113":"{","114":"�","115":"\u0002","116":"�","117":"�","118":"(",...etc
我认为它是图像对象，但在 json 中，对吗？
我也试图将 {{smthing}} 扔到 <img src=""> 标签和 <img ng-src="">，但它也不起作用。
问题是：如何显示这张照片？
有人可以帮帮我吗？
你好，艾伦。
无需转换为base64即可显示图像。
就用这个技巧吧。
假设您的 container Name 和 Image Name 是
Container Name = news-imgsFile Name = smallpic.png
然后下载link就像
/api/containers/news-imgs/download/smallpic.png
这意味着您可以通过
准备下载 link
/api/container/Your-Container-Name/download/Your-File-Name
并且在您看来，您可以显示像
这样的图像
<img ng-src="/api/container/Your-Container-Name/download/Your-File-Name" />
<img ng-src="/api/containers/news-imgs/download/smallpic.png" />
现在使用 Angular 为每个图像动态生成下载 link。
我正在使用 loopback-component-storage 将图像上传到服务器。 https://docs.strongloop.com/display/public/LB/Storage+component
我也有 AngularJS JavaScript SDK，所以我的 lb-services.js 是动态更新的。 https://docs.strongloop.com/display/public/LB/AngularJS+JavaScript+SDK
现在我想在我的网页上显示来自这个环回组件存储模型（称为容器）的照片，这样我就可以在我的 angular 控制器方法中使用 getFile（来自 lb-service），"Get information for specified file within specified container." 像那样：
$scope smthing = Container.getFile({container: 'news-imgs', file: 'smallpic.pnh'})
或者我可以使用方法下载，"Download a file within specified container." 像这样：
$scope smthing = Container.download({container: 'news-imgs', file: 'smallpic.png'})
在我的控制器中。
现在，问题是，当我将写入 .html 文件时 {{smthing}}，第一个方法将显示给我
{
"container": "news-imgs",
"name": "smallpic.png",
"size": 757,
"atime": "2015-12-01T11:49:36.840Z",
"mtime": "2015-12-01T11:49:36.840Z",
"ctime": "2015-12-01T11:49:36.840Z"
}
而第二种方法会显示出很多悲伤的迹象，像这样：
"0":"�","1":"P","2":"N","3":"G","4":"\r","5":"\n","6":"\u001a","7":"\n","8":"\u0000","9":"\u0000","10":"\u0000","11":"\r","12":"I","13":"H","14":"D","15":"R","16":"\u0000","17":"\u0000","18":"\u0000","19":"\u0014","20":"\u0000","21":"\u0000","22":"\u0000","23":"\u0012","24":"\b","25":"\u0003","26":"\u0000","27":"\u0000","28":"\u0000","29":"l","30":"\u000e","31":"\u000e","32":"\"","33":"\u0000","34":"\u0000","35":"\u0000","36":"\u0019","37":"t","38":"E","39":"X","40":"t","41":"S","42":"o","43":"f","44":"t","45":"w","46":"a","47":"r","48":"e","49":"\u0000","50":"A","51":"d","52":"o","53":"b","54":"e","55":" ","56":"I","57":"m","58":"a","59":"g","60":"e","61":"R","62":"e","63":"a","64":"d","65":"y","66":"q","67":"�","68":"e","69":"<","70":"\u0000","71":"\u0000","72":"\u0001","73":"�","74":"P","75":"L","76":"T","77":"E","78":"�","79":"�","80":"�","81":"�","82":"�","83":"�","84":"�","85":"\u0000","86":"r","87":"�","88":"�","89":"�","90":"�","91":"\u0000","92":"�","93":"�","94":"\u0000","95":"~","96":"�","97":"�","98":"�","99":"�","100":"\u0000","101":"x","102":"�","103":"\u0012","104":"�","105":"�","106":"\u0000","107":"","108":"�","109":"\t","110":"�","111":"�","112":"\u0016","113":"{","114":"�","115":"\u0002","116":"�","117":"�","118":"(",...etc
我认为它是图像对象，但在 json 中，对吗？
我也试图将 {{smthing}} 扔到 <img src=""> 标签和 <img ng-src="">，但它也不起作用。
问题是：如何显示这张照片？ 有人可以帮帮我吗？
你好，艾伦。
无需转换为base64即可显示图像。
就用这个技巧吧。
假设您的 container Name 和 Image Name 是
Container Name = news-imgsFile Name = smallpic.png然后下载link就像
/api/containers/news-imgs/download/smallpic.png这意味着您可以通过
准备下载 link/api/container/Your-Container-Name/download/Your-File-Name
并且在您看来，您可以显示像
这样的图像<img ng-src="/api/container/Your-Container-Name/download/Your-File-Name" />
<img ng-src="/api/containers/news-imgs/download/smallpic.png" />
现在使用 Angular 为每个图像动态生成下载 link。