ie8下使用knockoutjs遇到的一個模板異常

ViewModel中有一個數組，代碼大概以下：

function ReportViewModel(){
    var self = this;
    self.extendedProperties = ko.observableArray([]);
    ...
}

在從服務端獲取到數據以後，使用下面的代碼更新模型：

for (var index in json.extendProperties) {
    reportViewModel.extendedProperties.push(extendProperties[index]);
}

knockout會根據extendedProperties使用我定義好的模板生成html，模板代碼及綁定代碼大概以下：

<script type="text/html" id="template-report-extendproperty">
    <p class="the-week"><b data-bind="text:name"></b></p>
     ......
</script>
 <!--使用匯報模板-->
 <div class="write-report clearfix" data-bind="template: { name: 'template-report-extendproperty', afterRender: extendedPropertyRendered,foreach: extendedProperties }">
</div> 

上述代碼在ie9及以上，chrome下運行良好。但在ie8下會提示「name爲undefined」。

剛開始懷疑是ko在ie8下的bug，翻了下文檔沒有特殊說明，谷歌也沒找到相似的問題。

而後懷疑是否是在往reportViewModel.extendedProperties裏面push數據的時候，出現了一些髒數據。問了驗證這個問題，把更新ViewModel的代碼修改以下：

for (var index in json.extendProperties) {
    var extendProperty = json.extendProperties[index];
    consjole.log(index);
    console.log(extendProperty);
    createReportViewModel.extendedProperties.push(new ExtendProperty(extendProperty));
}

因而在控制檯獲得以下輸出：

奶奶的，遍歷完數組以後，把Array的prototype中的indexOf也給遍歷出來了。看來是for in語法在ie8下不大好使，仍是老實用$.each吧。更新ViewModel的代碼最終修改以下：

$.each(json.extendProperties, function(i, n) {
    reportViewModel.extendedProperties.push(new ExtendProperty(n));
});