使用 sammy.js 和 Knockout.js 从 url 显示单个项目

Question

我正在尝试完成类似于官方 knockoutjs 教程的“单页应用程序”部分中所做的事情，其中​​我首先有多个视图工作，然后添加 sammy 以使其脱离 url。 在我的示例中，单击名称将列表视图替换为单个项目详细信息视图。

这是我的 jsfiddle：http://jsfiddle.net/of73rdxa/2/ 如果您取消注释第 104 行：

//self.chosenFriend(friend);

在我尝试介绍 sammy 并从 url 传递 id 之前，您可以看到我是如何做到这一点的。不幸的是，这不再是我需要的，因为我现在想从 url 中的 id 而不是 clicked 事件中获取结果。

注释掉第 112 行：

 //{ name: 'fred', age:  '12' }

显示将起作用的格式的静态示例。不幸的是，我的 getFriend 方法没有以正确的格式返回数据来完成这项工作。

Answer 1

问题在于getFriend().name 之类的不会计算任何东西，因为getFriend() 现在没有返回，并且不能同步返回异步 ajax 调用的结果。

相反，您可以向 getFriend() 传递一个回调，使其在 ajax 成功函数like so (jsfiddle) 的范围内：

self.getFriend = function(id, cb){
var getString = 'http://rest.learncode.academy/api/johnbob/friends/' + id;

$.ajax({
  type: 'GET',
  url: getString,
  success: function(data) {
    console.log("from getFriend", data); //returns friend id#1
    console.dir(data);
    cb(data);
  }
});
...
Sammy(function() {
    this.get('#:friendId', function() {
      self.getFriend(this.params.friendId, self.chosenFriend);
    });
}).run();