gpt4 book ai didi

javascript - Aurelia:如何在绑定(bind)之前恢复到原始模型

转载 作者:行者123 更新时间:2023-12-01 01:42:00 25 4
gpt4 key购买 nike

这是一个棘手的问题。我有一个带有对象列表的选择元素:

<select class="form-control" value.bind="obj._selectedPlaylistForEdit">
<option repeat.for="playlist of obj._allPlaylists" value="${playlist.playlistID}" model.bind="playlist">${playlist.PlaylistTitle}</option>
</select>

然后,我有一个来自所选模型的项目列表:

<div if.bind="obj._selectedPlaylistForEdit" class="col-md-12 col-lg-12 custom-panel" id="playlist-slides"> 
<div class="col-md-12 col-lg-12 text-right" style="padding-top:15px;">
<span class="glyphicon glyphicon-plus-sign" style="color:#bf1e2d;cursor:pointer;font-size:16px;" title="Create new slide" data-toggle="modal" data-target=".bs-new-slide-lg"></span>
</div>

<div class="col-md-12 col-lg-12" id="slide-labels">
<label class="col-md-3 col-lg-3">Slide Title</label>
<label class="col-md-1 col-lg-1">Frequency</label>
<label class="col-md-1 col-lg-1">Duration</label>
<label class="col-md-2 col-lg-2">Start Date</label>
<label class="col-md-2 col-lg-2">End Date (optional)</label>
<label class="col-md-2 col-lg-2">Dynamic Data Needed</label>
</div>
<div class="col-md-12 col-lg-12" id="slide-element" data-toggle="modal" data-target=".bs-edit-slide-lg" repeat.for="slide of obj._selectedPlaylistForEdit.Slides" click.trigger="populateModalForEditSlide(slide)">
<h5 class="col-md-3 col-lg-3">${slide.CustomTitle}</h5>
<h5 class="col-md-1 col-lg-1">${slide.Frequency}</h5>
<h5 class="col-md-1 col-lg-1">${slide.Duration}</h5>
<h5 class="col-md-2 col-lg-2" if.bind="slide.StartDate != null">${slide.StartDate | dateFormat}</h5>
<h5 class="col-md-2 col-lg-2" if.bind="slide.StartDate == null"></h5>
<h5 class="col-md-2 col-lg-2" if.bind="slide.EndDate != null">${slide.EndDate | dateFormat}</h5>
<h5 class="col-md-2 col-lg-2" if.bind="slide.EndDate == null"></h5>
<h5 class="col-md-2 col-lg-2" if.bind="slide.SlideType.CustomDataType !== null">${slide.SlideType.CustomDataType}</h5>
<h5 class="col-md-2 col-lg-2" if.bind="slide.SlideType.CustomDataType === null">None</h5>
</div>
</div>

现在,当用户单击列表中的某个项目时,它会弹出一个 Bootstrap 模式,并使用户能够编辑该项目。模式上有 2 个按钮:取消和保存更改。

我遇到的问题是,如果我编辑该项目,然后单击“取消”,模型仍然会更改,因此看起来他们实际上已经编辑了该项目,而不是恢复到旧模型。无论如何,这附近有吗?

最佳答案

你的选择很少:

  1. 将所有模型字段的内容保存到模态视图模型上的一些临时字段。
  2. 在模态视图模型中具有单独的字段,并将其用于模态视图的绑定(bind)。模式启动时,从模型字段填写这些字段。单击保存更改后,将值复制到模型字段。
  3. #1 和 #2 的组合,克隆模型并使用它进行绑定(bind)。单击保存更改后,用克隆模型替换原始模型:

    let clone = Object.assign({}, model);

顺便说一句,请考虑使用aurelia-dialog插件。

关于javascript - Aurelia:如何在绑定(bind)之前恢复到原始模型,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38528487/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com