Question

基本上我正在尝试实现RobN的极其简单的模板切换器http://jsfiddle.net/rniemeyer/XYz8M/，它使用＆＃39;模板＆＃39;数据绑定。

   (---SO wants code here - see fiddle for complete code---)
   <div id="templateContent" data-bind='template: { name: currentView() }'></div>

   var viewModel = {
      currentView: ko.observable("template-1"),
      toggleView: function() {
       this.currentView(this.currentView() === "template-1" ? "template-2" : "template-1");   
     }
  };

  ko.applyBindings(viewModel);

我已经看到很多其他简单的例子，并且每个加载的模板都使用相同的viewModel类。例外 - RobN的SamplePresentation应用程序（我没有足够的重复点来发布另一个链接），同时令人印象深刻，我发现难以连接到我的noobie KO体验。我认为他在他的section.activate（）方法中这样做，但是，我不清楚。

我想在真实的应用程序中使用此概念，但具有绑定上下文问题。以下是我要做的事：http://jsfiddle.net/jockor/DSEDh/4/

   This line intentionally left blank (please see fiddle vs. mangling code here)

基本上，当按下导航链接/按钮时，我只想将身体内容面板换成另一个模板。该模板将需要由其自己的viewModel支持的自己的数据。

上面的小提琴是我对这个概念的简化版本 - 只是试图在Cats and Dogs面板之间切换。我遇到的是绑定到＆＃39;模板的数据。 data-bind用于加载的cat / dog模板。

有人可以告诉我，如果我这样做是正确的，或者我是否滥用了模板＆＃39;约束概念？

Answer 1

我已经修改了你的jsfiddle：

http://jsfiddle.net/5rmAL/2/

您还需要切换模板绑定的data字段。您只是切换了模板名称，我可以从您的代码中看到您正在寻找一种方法来更改视图模型数据。因此，我粗略地实现了它，以便在切换名称时将数据从viewModel切换到viewModel。有更优雅的方法可以做到这一点，但jsfiddle只是为了演示。

通过更改data，您可以修改模板指向的内容以获取其数据。通过实现这种可观察性，我能够获得它指向交换机的数据。我上面的快速粗略实现使用了一个简单的对象，它将模板名称和数据都保存在一个observable中。由于模板名称和数据必须同时切换，我更新observable内对象中的值，然后手动告诉observable其值已更改。如果更改模板名称之前的数据，它将尝试绑定以前的模板。同样，如果您在数据之前更改名称，它将尝试将旧数据绑定到新模板。所以，为了做到这一点，没有它在重新绑定模板时没有找到变量和东西，你需要确保你的template绑定在更改之前不会更新你的名字模板和要指向的数据。

编辑：我注意到你的敲除绑定中有一个函数处理程序，它将$ data作为函数的第一个参数传递。 Knockout总是首先将$ data作为函数的第一个参数传递，因此我将function () { ....goto($data); }替换为....goto（... = stuff）。这只是一个侧节点（甚至不需要对您的函数签名进行任何修改）。

在Knockout中实现菜单 - 在具有不同viewModel的视图之间切换

1 个答案: