Question

我目前正在使用KnockoutJS，其中一个viewmodel具有我网站所需的所有属性。当我在一开始初始化viewmodel时，我确保将null observable分配给相关属性，以便稍后更新它们时，将触发事件。我试图用knockoutfire集合做同样的事情 - 特别是我想在用户登录后加载数据而不必重新应用绑定 - 但是当我这样做时感觉有点沉重。这就是我所拥有的，并且我实际上能够在不重新应用绑定的情况下使其工作的唯一方法是：

// init view model
var viewModel = {
    prop1: ko.observable(null),

    firebase1: KnockoutFire.observable(recommenderFirebase.child('ratings/suggestions'), {
        '.limit': 0,
        "$suggestion" : {
            accountID: true,
            itemID: true,
            relevance: true
        }
    });
}

// apply all bindings for life of app
ko.applyBindings(viewModel);

// login user and re-populate firebase1
firebaseOOO.initAuthClient(function(user) {
    viewModel.firebase1 = KnockoutFire.observable(recommenderFirebase.child('ratings/suggestions').child(user.id), {
        '.limit': 20,
        "$suggestion" : {
            accountID: true,
            itemID: true,
            relevance: true
        }
    });
});

有更好，更清洁，更有效的方法吗？

Answer 1

如何使用包装器observable然后在登录后替换observable的值？

首先，applyBindings viewModel如下：

var viewModel = {
  prop1: ko.observable(null),
  afterLogin: ko.observable(null)
};

登录后，设置afterLogin新结构：

viewModel.afterLogin({
  firebase1: KnockoutFire.observable(…)
});

相应的视图可能如下所示：

<!-- ko with: afterLogin -->
  <ul data-bind="foreach: firebase1">
    <li><span data-bind="text: accountID"></span></li>
  </ul>
<!-- /ko -->

An idea sandbox of this answer at jsFiddle

Answer 2

添加放大js以轻松跟踪松散耦合的发布/订阅事件。登录前定义（订阅）事件，然后在登录时发布事件。

应用绑定后，更新KnockoutFire observable的Firebase参考

2 个答案: