knockout.js - 數據綁定ATTR默認值

我有一個attr一個簡單的HTML元素綁定：knockout.js - 數據綁定ATTR默認值

<img src="defaultImage.png" alt="default" data-bind="attr: {src: imgUrl, alt: imgAlt}" />

我想要做的是有一個自定義的擴展要爲src的默認值和alt並自動將它們初始化爲Knockout observables。

對於值或文本綁定，有很多例子可以做到這一點，但是對於任意attr綁定，沒有這樣的例子。

這可能嗎？

來源

2016-06-07 user2984303

你有沒有嘗試過任何方法呢？這並不完全清楚你所追求的目標，可能是因爲問題很廣泛，因爲有很多方法可以實現這一點。（「這是可能的嗎？」，答案是沒有冒犯的，是「是的」;因爲這個帖子看起來更像是一個僞裝的任務而不是一個問題） – Jeroen

這是骯髒的，但如果你沒有很多的地方，它應該寫成幫助：

<img src="defaultImage.png" alt="default" data-bind="attr: { src: imgUrl() || 'defaultUrl', alt: imgAlt() || 'defaultAlt' }" />

來源

2016-06-08 06:34:58 TSV

我有同樣的要求 - 認爲這例子僅僅只爲img標籤屬性，它可以很容易地擴展爲所有的屬性：

ko.bindingHandlers.src = { 
    update: function (element, valueAccessor) { 
     ko.bindingHandlers.attr.update(element, function() { 
      return {src: valueAccessor()}; 
     }); 
    } 
};

用法：

<img data-bind="src: imgUrl" />

上面的自定義綁定將遵循經典的方式，首先你將初始化observable，然後圖像src屬性被更新 - 這意味着，img src也將採用knockout observable的默認初始化值。

如果您需要相反的方式，你可以使用自定義綁定初始化回調：

ko.bindingHandlers.src = { 
    init: function(element, valueAccessor) { 
    var value = valueAccessor(); 
    value(element.src); 
    }, 
    update: function(element, valueAccessor) { 
    ko.bindingHandlers.attr.update(element, function() { 
     return { 
     src: valueAccessor() 
     }; 
    }); 
    } 
};

中標記的用法是一樣的，但在初始化時效果反轉。

這裏是一個Plunker：https://plnkr.co/edit/CwI6KGirOkb3XpgS0Dj8?p=preview

來源

2016-06-11 17:19:53 deblocker

knockout.js - 數據綁定ATTR默認值

回答

相關問題