Firebase和淘汰赛无法正常工作

时间:2013-04-26 23:23:40

标签: javascript knockout.js firebase

尝试使用firebase和knockoutjs工作的简单示例。我所要做的就是拿出firebase中的内容并将其绑定到我的模板中。听起来很简单吧?那么这里的代码是行不通的。我看了一下,但也许我错过了什么。哦,这也使用了knockoutfire。

    <!DOCTYPE html> 
<html> 
<head>
<title>knockout</title>

</head>

<body>


<div id="viewModel">
    <ul data-bind="foreach: chat">
        <li data-bind="text: nick"></li>
    </ul>
</div>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>
<script type="text/javascript" src="knockout.js"></script>
<script type='text/javascript' src='https://cdn.firebase.com/v0/firebase.js'></script>
<script type="text/javascript" src='knockoutFire/knockoutFire.js'></script> 
<script type="text/javascript" src='model.js'></script>

</body>
</html>

和model.js:

var firebase = new Firebase("https://kingpinapp.firebaseio.com");
var viewModel =  KnockoutFire.observable(firebase, {
chat: {
    nick: true,
}
});
ko.applyBindings(viewModel, document.getElementById("viewModel"));

如果我是一些如何让模型视图错误检查firebaseio链接以查看数据的布局方式。我访问index.html时得到的只是一个没有任何内容的列表。只是一个要点,没有别的。

编辑:刚认识到没有其他人可以看到我的数据。那么这里是从网址下载的JSON:

  {
  "chat" : {
    "nick" : "hello"
  }
}

1 个答案:

答案 0 :(得分:1)

我认为您必须使用with: chat代替foreach: chat

<ul data-bind="with: chat">

如果你需要foreach绑定,firebase中的数据看起来像;

{
  "chat": {
    "-XXX": {"nick": "hello"},
    "-YYY": {"nick": "hi"}
  }
}

和代码:

var viewModel =  KnockoutFire.observable(firebase, {
  chat: {
    "$chat": {
      nick: true,
    }
  }
});