使用IMG src的淘汰賽模型 - 不保存新值

我第一次使用淘汰賽，我嘗試製作網頁以允許用戶創建包含圖片網址的項目列表。我已經設法綁定img src屬性，但如果稍後使用jquery函數更新它，當保存淘汰模型時，不會採用新的src值。使用IMG src的淘汰賽模型 - 不保存新值

這裏是我的網頁的簡化版本，一個小提琴 - http://jsfiddle.net/TurUh/4/

如果單擊保存按鈕就可以看到該模型將原始圖像SRC（test.png）。如果您使用更改圖像按鈕，則圖像src更新爲（changed.png），您可以使用螢火蟲測試以確認html已更改。如果你再次點擊保存按鈕，模型將使用舊的src值（test.png）。

我做錯了什麼？任何人都可以建議如何解決這個問題？

來源

2012-09-25 user1573618

你走的是正確的軌道，但是你已經擺脫了在代碼中使用Knockout對象的作用，而不是在按鈕點擊上更新ViewModel。

我才能正常工作，看看你的想法在這裏更新您的代碼：

http://jsfiddle.net/TurUh/6/

爲別人解決這個問題，changeImage功能需要投入視圖模型和視圖模型對象需要更新，比如：

// Update the whole project array 
self.changeImages = function() { 
    for(var i=0; i < self.projects().length; i++) 
    { 
     self.projects()[i].ImageURL('changed.png'); 
    } 
};

記住，在IMAGEURL還需要使成可觀察到的對象，項目數組中。用於管理錯誤

來源

2012-09-25 12:52:26

完美，謝謝！我想我沒有正確理解數據綁定如何工作，這使事情變得更清晰。 – user1573618

沒問題，Knockout祝你好運，這是一個非常棒的圖書館，迄今爲止你對它有着深刻的理解。 –

最好的辦法：

ko.bindingHandlers.img = { 

    // Mise à jour de l'image 
    update: function (element, valueAccessor) { 
     // Données de l'observable 
     var value = ko.utils.unwrapObservable(valueAccessor()), 
      src = ko.utils.unwrapObservable(value.src), 
      fallback = ko.utils.unwrapObservable(value.fallback), 
      $element = $(element); 

     // On set l'url de l'image, si fichier innaccesible alors on set le src à fallback (url par défaut) 
     if (src) { 
      $element.attr("src", src); 
     } else { 
      $element.attr("src", fallback); 
     } 
    }, 

    // Init de l'image 
    init: function (element, valueAccessor) { 
     var $element = $(element); 

     $element.error(function() { 
      var value = ko.utils.unwrapObservable(valueAccessor()), 
       fallback = ko.utils.unwrapObservable(value.fallback); 

      $element.attr("src", fallback); 
     }); 
    } 
}; 

<img class="img-rounded img-responsive center-block" data-bind="img: { src: pictureUrl, fallback: _pictureDefault }" />

來源

2015-05-07 15:26:45 Yvan

使用IMG src的淘汰賽模型 - 不保存新值

回答

相關問題