2017-03-20 5 views
0

問題があります。私はngFileUploadを使ってドライブから画像をアップロードしています。その画像をアンカータグにバインドする必要があります。私は以下のコードを説明しています。ユーザーがドライブから任意の画像を選択している。ここAngular.jsでng-file-uploadを使用して画像URL inroアンカータグを設定できません

<div ng-repeat="mul in mulImage"> 
<input type="file" class="filestyle form-control" data-size="lg" name="upload_{{$index}}" id="bannerimage_{{$index}}" ng-model="mul.image" ngf-pattern="'image/*'" accept="image/*" ngf-max-size="2MB" ngf-select="onFileSelect1($index);"> 
<a href="mul.image" data-spzoom data-spzoom-width="400" data-spzoom-height="400"><img ngf-thumbnail="mul.image" name="pro" id="imgBig" border="0" style="width:32px; height:32px; border:#808080 1px solid;" ng-if="mul.image !=null"></a> 
</div> 

その表示img ngf-thumbnailを使用しますが、ここで私は、特定の画像のURLはa href=""に設定する必要があることと同じ時間を必要としています。ここで私は何かをしたが、期待通りに動作していない、この問題を解決するために私を助けてください。 HTMLで

答えて

0

:コントローラで

<div ng-repeat="mul in mulImage"> 
    <input type="file" ng-model="mul.image" ng-change="getFileUrl(mul)"> 
    <a href="mulImage[mulImage.indexOf(mul)].imageLink"></a> 
</div> 

$scope.getFileUrl = function(image) { 
    var reader = new FileReader(); 
    reader.readAsDataURL(image.image); 
    reader.onload = function() { 
     $scope.mulImage[mulImage.indexOf(image)].imageLink = reader.result; 
    }; 
} 
+0

私の記事をもう一度読んでください。 – satya

0

あなたは<a ng-href="mul.image"代わりの<a href="mul.image"を使用する必要があります。

おかげで、 のVinod

+0

私はあなた一人一人で行いましたが、出力で何が生成されているのかを確認しました。 ''再び同じURLを設定していないのと同じです。 – satya

+0

が 'ng-href =" {{mul.image}} "に変更されました –

関連する問題