单击箭头(按钮)时,该图像应设置为主图像,并且该值也应在后端生效。
我不知道这样做,尝试过dragula,但这对我来说还不够
下面给出的代码是 div 的放置方式
........
<li>
<div class="col-xs-12 dishkya">
<div class="file-up">
<input type="file" class="form-control filed" placeholder="Name" (change)="onFileChange($event,shopId)" #fileInput >
<img [src]="getShopImageURL((shopDetail | async)?.main_image)" class="add-pht">
<!-- <a class="deleteit"><i class="fa fa-trash" aria-hidden="true"></i></a> -->
</div>
</div>
</li>
<li>
<div class="col-xs-4 dishkya">
<div class="file-up">
<input type="file" class="form-control filed" placeholder="Name" (change)="SecondFileChange($event,shopId)" #fileInput >
<img [src]="getShopImageURL((shopDetail | async)?.image_one)" class="add-pht">
<!-- <a class="deleteit"><i class="fa fa-trash" aria-hidden="true"></i></a> -->
</div>
</div>
</li>
...........
图片上传的方式是
private imageUpload: any = {
"upload":""
};
private SecondimageUpload: any = {
"upload":""
};
...............
...............
onFileChange(event,shopId) {
var self = this;
if(event.target.files.length > 0) {
let file = event.target.files[0];
this.fileName = file.name;
this.imageUpload['upload'] = this.fileName;
this.form.get('upload').setValue(file);
}
self.check_publish_status = true;
this.imageUpload['upload'] = this.fileName;
const formModel = this.prepareSave();
var body = formModel;
..................
return this.http.post(url, body, options)
.catch(error => Observable.throw(error))
.subscribe(
data => {
self.fetchShopData();
)
........................
........................
请提供一个想法来实现这一点。