javascript 淘汰赛抛出消息：类型错误：<xxx> 不是函数。这是什么意思？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11303304/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
knockout throws Message: TypeError: <xxx> is not a function. What does it mean?
提问by ladookie
I have this code:
我有这个代码：
<ul id="chats" data-bind="foreach: chats">
<li>
<div class="chat_response" data-bind="visible: CommentList().length == 0">
<form data-bind="submit: $root.addComment">
<input class="comment_field" placeholder="Comment…" data-bind="value: NewCommentText" />
</form>
</div>
<a class="read_more_messages" data-bind="visible: moreChats, click: showMoreChats">Read More Messages...</a>
</li>
</ul>
function ChatListViewModel(chats) {
// Data
var self = this;
self.chats = ko.observableArray(ko.utils.arrayMap(chats, function (chat) {
return { CourseItemDescription: chat.CourseItemDescription,
CommentList: ko.observableArray(chat.CommentList),
CourseItemID: chat.CourseItemID,
UserName: chat.UserName,
ChatGroupNumber: chat.ChatGroupNumber,
ChatCount: chat.ChatCount,
NewCommentText: ko.observable("")
};
}));
self.moreChats = ko.observable(true);
self.showMoreChats = function () {
var LastChatGroupNumber = self.chats()[self.chats().length - 1].ChatGroupNumber;
$.ajax({
url: $.CourseLogic.dataitem.GetMoreChatsUrl,
data: "{chatGroupNumber: " + ko.toJSON(LastChatGroupNumber + 1) + "}",
type: "post",
contentType: "application/json",
success: function (chats) {
var chatList = self.chats();
$.each(chats, function (index, chat) {
self.chats.push(chat);
});
}
});
}
}
ko.applyBindings(new ChatListViewModel(initialData));
But I get this error when the showMoreChats function is called:
但是在调用 showMoreChats 函数时出现此错误：
Unable to parse bindings.
Message: TypeError: CommentList is not a function;
Bindings value: visible: CommentList().length == 0
Unable to parse bindings.
Message: TypeError: CommentList is not a function;
Bindings value: visible: CommentList().length == 0
What does it mean?
这是什么意思？
回答by antishok
It's not that CommentList is undefined, it's just that it's not an observable (hence not a function). The reason being that in your ajax callback, you are just pushing the 'chat' objects received from your server "as is". You're not creating for example a new observableArray called CommentList, but you're just putting a bare array CommentList - hence the thrown error by KO.
并不是 CommentList 是未定义的，只是它不是可观察的（因此不是函数）。原因是在您的 ajax 回调中，您只是“按原样”推送从服务器收到的“聊天”对象。例如，您没有创建一个名为 CommentList 的新 observableArray，而只是放置了一个裸数组 CommentList - 因此 KO 抛出了错误。
You would need to make the same transformation as you did when constructing self.chats in the viewmodel constructor, e.g.:
您需要进行与在 viewmodel 构造函数中构造 self.chats 时所做的相同的转换，例如：
$.each(chats, function(index, chat) {
self.chats.push(
{
CourseItemDescription: chat.CourseItemDescription,
CommentList: ko.observableArray(chat.CommentList),
CourseItemID: chat.CourseItemID,
UserName: chat.UserName,
ChatGroupNumber: chat.ChatGroupNumber,
ChatCount: chat.ChatCount,
NewCommentText: ko.observable("")
}
);
});
By the way, you should also take a look at the ko.mapping plugin, it can do this transformation for you.
顺便说一句，你也应该看看 ko.mapping 插件，它可以为你做这个转换。
Edit: Also, for better performance you shouldn't push each individual item into the observable array, but add them in one bulk operation, something like:
编辑：此外，为了获得更好的性能，您不应该将每个单独的项目推送到可观察数组中，而是将它们添加到一个批量操作中，例如：
self.chats( self.chats().concat( ko.utils.arrayMap(chats, function(chat) {
return { /* ... same as before ... */ };
} ) );
回答by Tyblitz
Found this question via Google, adding my case for reference. It's really, really stupid; yet this is a mistake caused by inattention I often make:
通过谷歌找到这个问题，添加我的案例以供参考。这真的非常愚蠢；但这是我经常犯的疏忽造成的错误：
When using one of the ko.utilsarray functions (arrayMap, arrayForEach, arrayFirst, etc.), Knockout will throw this error when you forget to specify the source array, eg. when you do:
当使用其中一个ko.utils数组函数（arrayMap、arrayForEach、arrayFirst 等）时，当您忘记指定源数组时，Knockout 将抛出此错误，例如。当你这样做时：
ko.utils.arrayMap(function(item) { ... })
instead of:
代替：
ko.utils.arrayMap(myArray, function(item) { ... });
回答by Paolo del Mundo
It means your binding cannot detect CommentList, i.e. CommentList is undefined in the current context.
这意味着您的绑定无法检测 CommentList，即 CommentList 在当前上下文中未定义。
