javascript - 扩展 javascript 通用 View 模型。 (昏死)

Question

上下文:我对我所认为的“严肃的 javascript/jquery 编码”还很陌生，我之前的尝试可能会被视为叛国:P。

我的问题:我注意到我们的一些客户端 View 模型中存在一种模式，并希望将其中一些合并到一个 .js 文件中。

一切似乎都适用于大多数场景，除了我需要创建一组额外的可观察值的屏幕，它们不一定映射到从服务器返回的我的 JS 对象。

 var AdminPages = AdminPages || {};  

 AdminPages.SimplePageVM: function (options) {

            var self = this;

            self.hasChanges = function () {};        
            self.isValid = function () {};

            // CRUD Actions
            self.get = function () {
                $.ajax({
                   url: options.getUrl,
                   dataType: 'json',
                   data: !$.isEmptyObject(options.someId) ? { someId: options.someId} : null,
                   success: function (result) {            
                       self.observables = ko.mapping.fromJS(result);
                       ko.editable(self.observables);
                       ko.applyBindings(self, $('form')[0]);
                   },
                   error: function (result) {}
                });
            };
            self.save = function () {};
            self.edit = function () {};
            self.cancel = function () {};

            // Initialise the viewmodel on create
            self.get();                      
  }

我想将以下内容添加到 View 模型中。我想我需要创建一个全新的对象(因为 self.observables 仅在 get 函数成功时创建)，然后在项目绑定(bind)上添加我的新对象及其属性。

想添加什么id:

 self.newObject.IsPercentageEvaluation = 
            ko.computed(function () {
                var isPercentage = self.observables.IsPercentageBased() == 'true';    
                  if (isPercentage) {                        
                      self.observables.BalancePercentage('40');
                  } else {
                      self.observables.BalancePercentage('');
                  }
                return isPercentage;
            });

总而言之:

$(function () {
        var obj = {
             IsPercentageEvaluation = ko.computed(...);
        };

        AdminPages.SimplePageVM({
            getUrl: '@Url.Action("Get", "SomeController")',
            editUrl: '@Url.Action("Update", "SomeController")',
            organisationId: '@ViewBag.OrganisationID',
            newObject: obj
        });

} ($));

我只是想确认这是否是处理这种情况的正确方法？或者是否有更好的方法，例如使用某种java脚本模式，或者某种程度的方法？

Answer 1

去年 Spring 我参与了一个大型项目，我们尝试遵循与您正在使用的模式类似的模式。

有一些问题需要考虑-

• 在 ajax.success 函数中，我们通常需要能够修改返回的 View 模式。例如，添加 ko.compulated 的。我建议您为此添加一个可重写的函数，并在 ko.applybindings 之前调用。
• 您需要能够处理应用程序返回数据时出现问题的情况。例如，数据库已关闭或 Web 服务离线。您需要有一种优雅的方式来处理这些情况。我们通过扩展 View 模型来做到这一点，以便在单独的属性上返回这些条件。
• 如果您要返回要在表数据中显示的行数据，则可能需要修改 ajax.success 函数以处理数据数组。我们似乎总是遇到这方面的问题。

我确实喜欢你的 View 模型。它是一段灵活且可扩展的代码。我将在下一个项目中借用它。