使用基於字符串變量controlflow

Question

我用淘汰賽的無容器controlflow模板模板：

<div data-bind="foreach: myData" style="margin-top: 10px;"> 
     <div> 
      <a href="#" data-bind="attr: {href: url}" target="_blank"> 
       <img src="http://www.google.com/s2/favicons?domain={{url}}" /> 
      </a> 
     </div> 
</div> 

獲取網址進入href是工作，但我想在圖片src再次調用url值。我想保留圖像源的開始部分，並將網址添加到最後。如何使用Knockout模板執行此操作？

Answer 1

對於這個簡單的任務，您不需要任何額外的模板，因爲KO可以讓您在綁定中編寫任何任意表達式，如字符串連接。

所以，你可以只是建立在attr您的網址右裝訂：

<div data-bind="foreach: myData" style="margin-top: 10px;"> 
    <div> 
     <a href="#" data-bind="attr: {href: url}" target="_blank"> 
      <img data-bind="attr: { 
       src: 'http://www.google.com/s2/favicons?domain=' + url()}" /> 
     </a> 
    </div> 
</div> 

注意：你需要寫url()如果您url屬性是ko.observable獲取其綁定表達式中值。

然而更合適的解決辦法是計算視圖模型內的圖像的URL，你將有你將與<img data-bind="attr: { src: imageUrl }"/>

綁定一個 imageUrl屬性