Question

给出像这样的绑定

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

图像DO正确显示但我可以在网络请求中看到两个请求被触发：

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

和（莫名其妙）

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

Answer 1

在我看来，adv.packageImagesVm.imageUrlBase（）在packageImagesCollectionDto（）之后更新，因此一旦更新集合，knockout就会执行foreach，然后一旦imageUrlBase更新它，就会更新src基于两个可观察量绑定到正确的值。如果是这种情况，您会看到localhost作为第一个请求。

视图模型是如何填充的？

您是否可以将“imageUrlBase”移动到对象的顶部？它不是很整洁，但是它应该强制敲除首先更新/创建那个可观察对象并且没有任何约束但它不会不必要地触发任何东西然后当dtos绑定时你已经拥有了imageUrlBase的值所以它不会发出本地主机请求。

我希望一切都有道理！： - ）

与KnockoutJs绑定的图像src启动两个请求

1 个答案: