Durandal ko 映射：映射的 li 未在 DOM 中呈现答案

【问题标题】：Durandal ko mapping : mapped li not rendered in DOMDurandal ko 映射：映射的 li 未在 DOM 中呈现
【发布时间】：2013-11-11 04:48:42
【问题描述】：

我是 durandal 的新手。我试图在 durandal 使用 mimosa skelton 提供的演示应用程序中添加一个新模块。

我按照this中的步骤创建了模块

当我运行应用程序时，与数据绑定关联的 <li> 不会填充到 DOM 中。即，页面中不显示任何数据。

但是当我使用 console.log 在 myPage.js 中打印数据时，它会给出所需的输出。

我的模块 backend.js

define(function(require){
  return {
    getCustomers:function(){
      //do some ajax and return a promise
        return $.ajax({
          url: 'http://graph.facebook.com/facebook?callback=?',
          dataType: 'json',
        }).promise();
    }
  };
});

我的 myPage.js

define(function (require) {
    var backend = require('backend');
    var ko = require('knockout');

    return {
        customer:ko.observableArray([]),
        activate:function(){
          var that = this;
          return backend.getCustomers().then(function(result){
            that.customer(result);
          });
        }
      };
});

myPage.html

<div>
  <h2>FB Page Detail</h2>
  <ul data-bind="foreach: customer">
    <li data-bind="text: name"></li>
  </ul>
</div>

得到的结果

{"about":"Facebook's mission is to give people the power to share and make the world more open and connected.","category":"Product/service","company_overview":"Newsroom: http://newsroom.fb.com\nInvestor Relations: http://investor.fb.com/","founded":"February 4, 2004","is_published":true,"talking_about_count":207120,"username":"facebook","website":"http://www.facebook.com/facebook","were_here_count":0,"id":"20531316728","name":"Facebook","link":"http://www.facebook.com/facebook","likes":96174118,"cover":{"cover_id":"10151496277356729","source":"http://sphotos-a.ak.fbcdn.net/hphotos-ak-ash2/s720x720/247388_10151496277356729_2043388331_n.jpg","offset_y":0,"offset_x":0}}

我做错了什么？如何解决这个问题？

【问题讨论】：

你这里的对象不是数组

标签： javascript html knockout.js durandal ko.observablearray

【解决方案1】：

我认为您的问题在于您如何使用 knockoutJS 而不是 durandal .. 您正在将 object(single object) 传递给您的 observableArray .. 虽然您应该传递对象数组或一个对象的数组..

我做了简单的 DEMO 来重现您的问题..

注意没有显示结果，但是如果你把 magic [] 放在你的数据周围作为单个对象的数组，你会得到 Facebook 名称显示

【讨论】：

【解决方案2】：

不确定您如何在此处应用绑定，您可能需要使用，因为您的模型在视图模型中设置为客户属性。
data-bind="html:customer.name"

【讨论】：

您的响应在服务器端看起来如何？在that.customer(result); 中结果如何？
result 是一个数组？
对象 {about：“Facebook 的使命是赋予人们分享的力量，让世界更加开放和互联。”，类别：“产品/服务”，company_overview：“新闻编辑室：newsroom.fb.com ↵投资者关系：investor.fb.com"，成立时间："February 4, 2004"，is_published: true…}