Aurelia：如何在綁定前恢復原始模型

這是一個棘手的問題。我已經有了對象的可列表中選擇元素：Aurelia：如何在綁定前恢復原始模型

<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>

現在，用戶點擊時在列表中的一個項目上，它彈出一個引導模式，併爲用戶提供編輯該項目的能力。模式上有2個按鈕：取消&保存更改。

我遇到的問題是，如果我編輯的項目，然後單擊取消，該模式仍然改變，所以它看起來像他們實際上已經編輯的項目，而不是恢復到舊的模式。有沒有辦法解決？

來源

2016-07-22 James

你有幾種選擇：

保存所有模型領域的一些溫度場內容/模態的視圖模型領域。
在模態的視圖模型中有單獨的字段，並使用它來綁定模態視圖。模態啓動時，從模型字段填入這些字段。當點擊save changes時，將值複製到模型字段。
的＃1和＃2的組合，克隆模型，並使用該用於結合。當點擊save changes，用克隆來替換原來的模式：
```
let clone = Object.assign({}, model); 
```

順便說一句，可以考慮使用aurelia-dialog插件。

來源

2016-07-22 16:12:22

Aurelia：如何在綁定前恢復原始模型

回答

相關問題