使用 knockout.js 和 Sammy.js 时，如何设置内容来自模板的可观察路由答案

【问题标题】：How can I set observable routes where the content comes from a template when using knockout.js and Sammy.js使用 knockout.js 和 Sammy.js 时，如何设置内容来自模板的可观察路由
【发布时间】：2016-02-16 17:00:20
【问题描述】：

我正在尝试使用 Sammy.js 为路由制作单页应用程序。 This是JS：

var galleryTemplateUrl = "templates/galleryTemplate.html";
var registerTemplateUrl = "templates/registerTemplate.html";
var containerId = '#container';
var containerElement = $(containerId);

var app = new Sammy(containerId, function() {
    var self = this;
    self.get('#/Gallery', function() {
        containerElement.html("");
        $.ajax({
            method: "POST",
            url: galleryTemplateUrl
        }).done(function  (result) {
            containerElement.append(result);
            ko.applyBindings(testView(),containerElement[0]);
        })
    });

    self.get('#/Register', function(){
        containerElement.html("");
       $.ajax({
        method: "POST",
        url: registerTemplateUrl
       }).done(function  (result) {

          containerElement.append(result);
       })
    });
});

app.run('#/Gallery');

剩下的就很简单了。我的 HTML 中有一个容器 div，模板是 HTML 文件，其中包含一些数据绑定。

问题：一旦我启动应用程序，绑定就会在我第一次加载它们时成功读取，但是如果我更改到下一个路由并返回到上一个路由，则绑定不再适用。

我想我应该重置 ko.applyBinding 中的函数，但我不知道怎么做。

我尝试在发出新的 AJAX 请求之前添加 ko.clearNode()，但效果不佳。

有什么想法吗？

编辑：我找到了解决问题的方法，但它可能不是“正确”的解决方案。基本上我把我的容器 div 放在另一个 div 中。然后每次我向容器 div 添加模板时，我都会删除它并使用不同的 id 重新制作它。

编辑： 问题的根源似乎是，如果在传递给 new Sammy 的同一元素上使用 cleanNode()，那么 cleanNode 也会关闭 Sammy。基本上不会在 Sammy 正在运行的元素上使用 cleanNode。

【问题讨论】：

标签： javascript knockout.js routing sammy.js

【解决方案1】：

我建议您使用 Knockout 来管理 DOM。这可能意味着为每个路由页面创建一个component（或者可能只是一个template），并让路由器激活相应的页面。

This answer 可能会有所帮助。

【讨论】：