圖片src與KnockoutJs結合發起兩個請求

給定一個這樣的圖片src與KnockoutJs結合發起兩個請求

<img data-bind="attr: { src: (adv.packageImagesVm.imageUrlBase() + $data) }" alt="product image" />

的圖像結合確實會正確顯示，但我可以在請求被解僱的網絡請求，請參閱：

1：myAccount.blob.core.windows.net/public/myImage.png（OK）

和（莫名其妙地）

2. http://localhost/public/myImage.png

有誰知道爲什麼第二次請求發生？

編輯：更多的代碼位：

<ul class="thumbnails" data-bind="foreach: packageImagesCollectionDto().PackageVoucherImageUrls"> 
    <li class="span2" data-bind="if: $data, visible: $data">   
     <img data-bind="attr: { src: (adv.packageImagesVm.imageUrlBase() + $data) }" alt="product image" />       
    </li> 
</ul>

編輯：這裏有<div data-bind="text: ko.toJSON($data)"></div>

{ 
    "packageImagesCollectionDto": { 
     "PackageId": 2, 
     "PackageImageUrls": [ 
      "/public/product/55/AAID220.jpg",     
      "/public/product/80/retreat.jpg" 
     ], 
     "PackageVoucherImageUrls": [ 
      "/public/product/55/voucher/AAFL2xx.jpg",     
      "/public/product/80/voucher/ddVoucher.jpg" 
     ] 
    }, 
    "imageUrlBase": "http://xyz.blob.core.windows.net" 
}

來源

2013-07-23 Neil Thompson

你可以顯示你的視圖模型的代碼？主要是'PackageVoucherImageUrls'和'imageUrlBase（）' – CodingIntrigue

你可以添加一個span來查看url嗎？ – Damien

@Damien - 跨度顯示組合元素，例如：xyz.blob.core.windows.net/public/product /80/voucher/ddVoucher.jpg –

結果看起來對我來說，adv.packageImagesVm.imageUrlBase（）packageImagesCollectionDto後更新（），所以一旦集合被更新，knockout將會做foreach，然後只要imageUrlBase更新它，然後基於這兩個observable將src綁定更新爲正確的值。如果是這樣的話，你會看到localhost作爲第一個請求。

如何填充視圖模型？

你能夠將「imageUrlBase」移動到對象的頂部嗎？它並不整齊，但它應該強制淘汰更新/創建可觀察的第一個，因爲沒有任何約束，但它不會不必要地觸發任何東西，然後當dtos綁定你已經有了imageUrlBase的價值，所以它將不會發起本地主機請求。

我希望一切都有道理！ :-)

來源

2013-07-23 13:03:16 DoctorMick

就是這樣！在其他可觀察對象解決問題之前設置imageUrlBase。做好醫生（我會在下次做@Damien建議）。謝謝大家 –

圖片src與KnockoutJs結合發起兩個請求

回答

相關問題