在设置我的网页的视图模型时遇到问题

时间:2014-07-01 00:13:32

标签: javascript mvvm knockout.js web

function npCinemaViewModel() {
  var self = this;

  self.movies = ko.observableArray([
    { name: "3 Days to Kill", url: "http://www.youtube.com/embed/vf49ZETvNaQ" },
    { name: "Endless Love", url: "http://www.youtube.com/embed/5paHdmfFNS8" },
    { name: "Robocop", url: "http://www.youtube.com/embed/xPLSpmAtc1Q" },
    { name: "Lego Movie", url: "http://www.youtube.com/embed/fZ_JOBCLF-I" }
  ]);
}

ko.applyBindings(new npCinemaViewModel());
<nav id="movies">
  <ul data-bind="foreach: movies">
    <li><a class="youtube glowButton" data-bind="text: name, attr: {href: url}"></a></li>
    <!--<li><a class="youtube glowButton" href="http://www.youtube.com/embed/5paHdmfFNS8">Endless Love</a></li>
    <li><a class="youtube glowButton" href="http://www.youtube.com/embed/xPLSpmAtc1Q">Robocop</a></li>
    <li><a class="youtube glowButton" href="http://www.youtube.com/embed/fZ_JOBCLF-I">Lego Movie</a></li>-->
  </ul>

数据不会出现在数据绑定的doms中,我无法弄清楚问题所在。我已经将脚本链接到与其他脚本相同的方式,并且开发工具显示源.js文件确实被识别。似乎viewModel似乎没有被应用。帮助将不胜感激。

1 个答案:

答案 0 :(得分:1)

原来我需要在文档加载后应用绑定。

$(document).ready(function(){
  ko.applyBindings(new npCinemaViewModel());
});