2

在基于 Knockoutjs 和 Sammy.js 的 Web 应用程序中，我有三个以父子方式相互依赖的可观察对象（第二个是第一个的孩子，第三个是第二个的孩子）。我的 HTML 包含三个部分，一次只能看到一个部分。每个部分都依赖于使用可见绑定的上述可观察对象之一。

我的 URL 方案的布局类似于 /#id-of-parent/id-of-child/id-of-grandchild（在 Sammy.js 中）。

如果我访问一个完整的 URL（一个具有所有三个 id 的 URL），我会遇到 observables 的麻烦。在 Sammy 规则函数中，我首先加载和存储父项，然后是子项，最后是孙子项（这实际上是用户想要查看的数据）。问题是父母和孩子的绑定也被触发了。

有没有办法避免触发绑定，或者有没有更好的方法来组织这样的应用程序？

这是我的 Sammy 路线：

Sammy(function() {
  this.get('#study/:id', function() {
    self.studylist(null);
    self.currentStudy(Study.loadById(this.params.id));
  });

  this.get('#study/:id/variableGroups', function() {
    self.variableGroupList(self.currentStudy().variableGroups());
    self.currentVariable(null);
  });

  this.get('#study/:id/variable-group/:variableGroup/variables', function() {
    var groupId = this.params.variableGroup;
    $.ajax(apiUrl + "/variable-group/" + groupId, {
      type: "GET",
      async: false,
      cache: false,
      context: this,
      success: function(data) {
        if (!self.currentStudy()) {
          self.currentStudy(Study.loadById(this.params.id));
        }
        self.currentVariableGroup(new VariableGroup(data.variablegroup));
        self.variableList(self.currentVariableGroup().variables);
      }
    });
  });

  this.get('#study/:id/:variableGroupId/:variableId', function() {
    var variableId = this.params.variableId;
    $.ajax(apiUrl + "/variable/" + variableId, {
      type: "GET",
      async: false,
      cache: false,
      context: this,
      success: function(data) {
        if (!self.currentStudy()) {
          self.currentStudy(Study.loadById(this.params.id));
        }
        if (!self.currentVariableGroup()) {
          self.currentVariableGroup(VariableGroup.loadById(this.params.variableGroupId));
        }
        self.currentVariable(new Variable(data.variable));
      }
    });
  });

  this.get("", function() {
    self.currentStudy(null);
    self.currentVariableGroup(null);
    self.currentVariable(null);
    $.get(apiUrl + "/study/all", function(data) {
      var mappedStudies = $.map(data.studies, function(item, index) {
        return new Study(item);
      });
      self.studylist(mappedStudies);
    });
  });

  this.get('', function() { this.app.runRoute('get', "")});

}).run();
4

1 回答 1

1

我认为这是不可能的，而且有充分的理由。在不通知订阅者的情况下更新订阅者违反了数据绑定的原则。我强烈建议您重构您的程序，以便更新currentStudy并且currentVariableGroup不会导致不必要的副作用。让其他一些因素决定所需的效果，也许是一个activeTemplate可观察的。

无论如何，这里是observable. 请注意，内部值是私有成员，不能从外部访问。它只能通过调用 observable（通知订阅者）来设置。

ko.observable = function (initialValue) {
    var _latestValue = initialValue; //Value is in closure, inaccessible from outside

    function observable() {
        if (arguments.length > 0) {
            // Write

            // Ignore writes if the value hasn't changed
            if ((!observable['equalityComparer']) || !observable['equalityComparer'](_latestValue, arguments[0])) {
                observable.valueWillMutate();
                _latestValue = arguments[0];
                if (DEBUG) observable._latestValue = _latestValue;
                observable.valueHasMutated();
            }
            return this; // Permits chained assignments
        }
        else {
            // Read
            ko.dependencyDetection.registerDependency(observable); // The caller only needs to be notified of changes if they did a "read" operation
            return _latestValue;
        }
    }
于 2012-07-25T15:52:37.250 回答