Knockout.js 敲除不显示绑定到img元素的图像

我正在尝试一个样本来开始它。由官方网站提供的基本功能运行良好。但我试过一个样品 未按预期工作的示例。 有人能告诉我正确的方向，使下面的样本工作吗

这是我的视图模型

/// <reference path="../Scripts/jquery-2.1.0.min.js" />
/// <reference path="../Scripts/knockout-3.1.0.js" />

function ImagesModelForEachRow(image1, image2, image3) {
var self = this;
self.image1 =  ko.observable(image1);
self.image2 = ko.observable(image2);
self.image3 = ko.observable(image3);

}

var ImagesListModel = function () {
var self = this;
self.ImagesArray = ko.observableArray([]);
self.GetImagesList = function () {
    $.ajax({

        type: "POST",
        url: "ImageDisplay.aspx/getallImages",
        data: {},
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: fnsuccesscallback,
        error: fnerrorcallback
    });

    function fnsuccesscallback(data) {
        $.each(data.d.ImagesList, function (idx, val) {
            debugger;
            self.ImagesArray.push(new ImagesModelForEachRow(val.Image1, val.Image2, val.Image3));
        });


    }
    function fnerrorcallback(result) {
        alert(result.statusText);
    }
}


}

$(document).ready(function () {

debugger;

var v = new ImagesListModel();
ko.applyBindings(v);

});

据我所知，由于image2是一个可观察的对象，所以应该将其作为函数调用。我甚至试着把它简单地称为财产

---

有人能帮我理解这段代码的问题吗？

哦，刚刚注意到，你的img标签语法不正确。没有所谓的

。你需要把它去掉。尝试：

 <td>
    <img data-bind="attr: {src: 'Images/'+$data.ImagesArray()[0].image2()+'.png'}" >
  </td>
  <td>
      <img data-bind="attr: {src: 'Images/'+$data.ImagesArray()[0].image2()+'.png'}">
  </td>
  <td>
   <img data-bind="attr: {src: 'Images/'+$data.ImagesArray()[0].image2()+'.png'}">
  </td>

---

我已将我的表格标签更新为下面的标签

<table border="2" data-bind="ifnot: ImagesArray().length == 0">

---

除此之外，还删除了不必要的跨距，解决了我的问题。

控制台中是否有错误？按照PW的建议检查控制台中的错误后，下一步是右键单击生成的元素并选择Inspect元素以查看生成的HTML敲除。您的代码的哪一行是：ImageDisplay.aspx，第2行字符57？如果这解决了您的问题，请接受答案或另行通知我们。谢谢，谢谢Chuck的回复。我试过了，但没能解决问题。请仔细阅读编辑后的问题。嗨，各位，你们明白为什么这解决了你们的问题吗？是的，恰克·施耐德。当页面第一次尝试呈现html时，ImagesArray将为空。所以它没有image1属性。这导致对象为null或未定义异常。你觉得这不对吗？如果我想错了，请告诉我是的，那是绝对正确的。我通常通过使用with:或if:绑定来解决这个问题。也就是说，我将定义self.ImagesArray=ko.observableArray（）；（注意，否[]）然后对：ImagesArray或if:ImagesArray执行操作。当您的ajax调用填充数组时，KO将填充DOM，只是好奇地想知道。您能告诉我将其声明为ObservalArray（）和ObservalArray（[]）之间的区别吗？我相信如果添加[]，您将拥有一个空数组，并且需要像您那样检查长度。如果不使用该选项，则数据绑定：“with:ImagesArray”或If:ImagesArray将求值为false，直到在ajax成功回调中初始化数组为止……我想……我还没有尝试过这一点。但这是我对行为的猜测。

SCRIPT5007: Unable to get value of the property 'image2': object is null or undefined 
ImageDisplay.aspx, line 2 character 57

 <td>
    <img data-bind="attr: {src: 'Images/'+$data.ImagesArray()[0].image2()+'.png'}" >
  </td>
  <td>
      <img data-bind="attr: {src: 'Images/'+$data.ImagesArray()[0].image2()+'.png'}">
  </td>
  <td>
   <img data-bind="attr: {src: 'Images/'+$data.ImagesArray()[0].image2()+'.png'}">
  </td>

<table border="2" data-bind="ifnot: ImagesArray().length == 0">