我有一个网页在Chrome浏览器中效果很好,但在IE9中效果不佳。该错误在控制台上出现的错误是

SCRIPT5022:无法解析绑定。
消息:[对象错误];
绑定值:foreach:statlist。

HTML如下:

<html>
    <head>
        <title>TODO supply a title</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div id="statsarea" data-bind="foreach: statlist">
           <p> TypeCount: <strong data-bind="text: TypeCount"></strong>, Priority: <strong data-bind="text: SentDate"></strong>
            <br/>
           </p>

    </div>


        <script src="js/jquery-1.9.0.js" type="text/javascript"></script>
        <script src="js/knockout-2.2.1.js" type="text/javascript"></script>
        <script src="models/messagecount.js" type="text/javascript"></script>

    </body>
</html>


Javascript:

function MessageCountDataModel() {

    var self = this;
    var allCounts = (function() {

        var json = null;

        $.ajax({
            'async': false,
            'global': false,
            'url': "http://localhost:8080/API/getstats.json",
            'datatype': "json",
            'success': function(data) {
                self.statlist = data;
            }
        });
    })();
}

ko.applyBindings(new MessageCountDataModel());


还有一点信息是,来自API的json看起来像这样。我不确定是否是因为TypeCount不是字符串?

[
    {
        "TypeCount": 102,
        "SentDate": "2014-08-18T00:00:00.000Z"
    }
]

最佳答案

使用async: false不是一个好主意。可能是问题所在,因为您没有在ViewModel中将statlist初始化为属性。更好的解决方案是使statlist成为可观察的数组,然后进行异步调用以及何时可以设置数据。

例:

function MessageCountDataModel() {
    var self = this;

    self.statlist = ko.observableArray();

    self.loadData = function() {
        $.ajax({
            'url': "http://localhost:8080/API/getstats.json",
            'datatype': "json",
            'success': function(data) {
                self.statlist(data);
            }
        });
    };

    self.loadData();
}

ko.applyBindings(new MessageCountDataModel());

09-10 10:44
查看更多