我在Modular中使用AngularJS中的file input of jasny-boostrap,所以我也使用了jasny-bootstrap-angular。我有两个疑问:
当我点击按钮打开模型时,我可以选择我想要的文件。如果我选择一个文件e关闭模型,当我再次打开模型时,文件将在数据预览中,它不会清理。当我点击我的按钮打开模态时,我希望在我的angularjs中传递空值(或重置)此图像预览(fileinput-preview thumbnail);
如果点击一个调用模态的按钮,我想自动将图像从我的网络服务获取到数据预览并自动将按钮更改为“删除”和“更改”,我得到了一个图片到服务。
我的HTML:
<div class="fileinput fileinput-new" data-provides="fileinput">
<div class="fileinput-preview thumbnail" style="width: 200px; height: 150px;"></div>
<div>
<span class="btn btn-primary btn-file">
<span class="fileinput-new">Select a image</span>
<span class="fileinput-exists">Change</span>
<input type="file" name="file" file-model="fileinput"> <!--compose.myFile-->
</span>
<a href="#" class="btn btn-primary fileinput-exists" data-dismiss="fileinput">Remover</a>
<button class="btn btn-info" ng-click="showInput()">Show Input</button>
</div>
</div>
如果我点击“显示输入”我可以看到图像二进制文件,我使用了这个angularjs:
$scope.showInput = function () {
console.log($scope.fileinput.result);
}
我正在使用这个HTML代码和我的angularjs来查看来自Web服务的图像,这一切都很完美:
<!-- Foto view-->
<div class="form-group">
<img ng-show="equipamento.FotoEquipamento != null" style="height:auto; width:225px;" data-ng-src="{{getImage(equipamento.FotoEquipamento)}}" />
</div>