無法將圖像綁定到img標簽

Question

我正在使用WinJS進行Windows Phone開發，我有以下代碼解析從特定URL接收的JSON。 並使用將圖像綁定到HTML頁面中的列表視圖，

JavaScript代碼：

 WinJS.xhr({ url: urlToBeUsed }).then(
     function (sportsResponse) {
         var sportsJSON = JSON.parse(sportsResponse.responseText);
         var listItems = sportsJSON.Videos.Data;

         for (var i = 0; i < listItems.length; i++) {
             var imageList = listItems[i].Items;
             var count = imageList.length;
             if (count > 0) {

                 listItems[i].Items[0].Images.forEach(imageIteration);

                 function imageIteration(value, index, array) {
                     var picture = value.Url;
                     var name = value.title;

                     sportsImageList.push({
                         title: name,
                         picture: picture
                     });
                 }
             }
         }
         imageList.itemDataSource = sportsImageList.dataSource;
     })
 }

HTML代碼：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8" />
    <title></title>

    <!-- WinJS references -->
    <script src="//Microsoft.Phone.WinJS.2.1/js/base.js"></script>
    <script src="//Microsoft.Phone.WinJS.2.1/js/ui.js"></script>
    <script src="/js/navigator.js"></script>
    <link href="/css/default.css" rel="stylesheet" />
    <link href="/pages/home/home.css" rel="stylesheet" />
    <script src="/pages/sports/sports.js"></script>
  </head>
  <body>
    <!-- The content that will be loaded and displayed. -->
    <div class="fragment homepage" style="width:100%;height:100%;padding:10px">
      <div class="myTemplate" data-win-control="WinJS.Binding.Template">
        <div class="myItem">
          <img data-win-bind="src:picture" style="width:100px;height:100px" />
        </div>
      </div>
      <div id="imageList" data-win-control="WinJS.UI.ListView" data-win-bind="winControl.itemDataSource:sportsImageList.dataSource" data-win-options="{itemTemplate:select('.myTemplate')}"></div>
    </div>
  </body>
</html>

我嘗試了多種方法將URL綁定到圖像，但是在屏幕上我只能看到鏈接，而看不到實際圖像。 我哪里錯了？ 感謝所有幫助和建議。 謝謝！

Answer 1

我相信您的錯誤是在您的分配行中，請記住itemDataSource是ListView控件的屬性。 就像在代碼中一樣，您正在將該屬性分配給imageList元素。

更改為此：

imageList.winControl.itemDataSource = sportsImageList.dataSource;

無法將圖像綁定到img標簽

問題描述

1 個解決方案

解決方案1
0 已采納 2014-09-03 15:52:11

無法將圖像綁定到img標簽

問題描述

1 個解決方案

解決方案1 0 已采納 2014-09-03 15:52:11

解決方案1
0 已采納 2014-09-03 15:52:11