在 Knockout 中，我的对象应该如何构建以实现正确的 MVVM？

Question

我正在处理淘汰赛，并试图保持真实的 MVVM 结构，并试图使对象相互依赖。

这是我目前拥有的，温柔点，我还在学习这个：

模型、视图模型、服务定义：

var App = window.App || {};

(function(ns, $, ko) {
    ns.Models = {};
    ns.ViewModels = {};
    ns.Services = ns.Services || {};

    //Service def
    ns.Services.SearchService = function() {
        this.SearchByName = function(name, callback) {
            $.get("/api/SearchByName/" + name, function(d){
                callback(d);
            });
        };
    };

    //Model Def
    ns.Models.SearchResultModel = function(json) {
        var self = this;

        ko.mapping.fromJS(json, {}, self);
    };

    //ViewModel def
    ns.ViewModels.SearchResultsViewModel = function() {
        var self = this;

        self.dataService = new ns.Services.SearchService();
        self.SearchResults = ko.observableArray();

        self.GetSearchResultsByName = function(name){
            self.dataService.SearchByName(name, function(d) {
                $.each(d, function(i, e) { self.SearchResults.push(new ns.Models.SearchResultModel(e)); });
            });
        };
    };
}(App, jQuery, ko));

我现在可以这样使用它：

var vm = new App.ViewModels.SearchResultsViewModel();

vm.GetSearchResultsByName("Doe");

ko.applyBindings(vm, document.getElementById("search-results-form"));

这只是我的起点，看起来ko.applyBindings(...) 应该在 ViewModel 的某个地方。

综上所述，我是朝着正确的方向前进还是完全放弃了它？

Answer 1

没有什么不寻常的外观。这是一个很难回答的问题，因为如果没有你做错了什么，那就没什么好说的了......

我注意到的一件事是

$.get("/api/SearchByName/" + name, function(d){
    callback(d);
});

应该替换为

$.get("/api/SearchByName/" + escape(name)).done(callback);

name 应该被转义，因为它可能包含无效的 URL 字符，并且没有理由包装回调。 （一般来说，表达式function (x) { f(x) } 只是在更简单的表达式f 上添加了不必要的间接性。）

在GetSearchResultsByName 函数中，一个比d 更具描述性的名称会很好，尤其是因为您在其他地方的命名非常冗长。