javascript - 如何使用knockout映射插件绑定(bind)匿名对象?

标签 javascript json knockout.js knockout-mapping-plugin

我正在尝试列出此 json 数据中的所有用户名:

[{
        "full_name": "root",
        "group": 0,
        "home": "/root",
        "username": "root",
        "id": 1
    }, {
        "full_name": "Owner of many system processes",
        "group": 1,
        "home": "/root",
        "username": "daemon",
        "id": 2
    }, {
        "full_name": "System",
        "group": 5,
        "home": "/",
        "username": "operator",
        "id": 3
    }]

我的 HTML 看起来像这样:

 <body>
        <h2>Knockout list</h2>
        <ul data-bind="foreach: users">
            <li data-bind="text: username"></li>
        </ul>

        <script type="text/javascript">
            function getUsers()
            {
                return $.ajax
                        ({
                            type: "GET",
                            url: "http://XXX.XXX/api/userinfo",
                            username: "root",
                            password: "meh",
                            cache: false,
                            dataType: "json"
                        });
            }

            getUsers().done(function(results)
            {
                var users = "{users: " + results + "}";
                var viewModel = ko.mapping.fromJS(users);
                ko.applyBindings(viewModel);
            });

        </script>
 </body>

在控制台中我收到此错误:

ReferenceError: users is not defined
with($context){with($data||{}){return{'foreach':function(){return users }}}}

我认为向 json 添加任何内容不是一个好主意。我正在尝试使用 var users = "{users: " + results + "}"; ,但这比其他任何事情都更加绝望,如果可能的话我想避免它。

你知道如何实现这个功能吗?谢谢。

最佳答案

给定您的 HTML,您的 View 模型需要有一个名为 users 的属性,因为这就是您在 foreach 循环中迭代的内容。我不能确定,但​​是从结果创建新对象的行看起来不正确。您可以尝试在 View 模型上创建显式用户属性并将映射结果分配给它:

var viewModel = {};
viewModel.users = ko.mapping.fromJS(data);
ko.applyBindings(viewModel);

创建了 jsfiddle ,并且它在那里工作。

关于javascript - 如何使用knockout映射插件绑定(bind)匿名对象?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/24866835/

相关文章:

javascript - 您可以在 Kendo MVVM View 中编写纯 JavaScript 表达式(与 Knockout 一样)吗?

javascript - 如何调试Javascript进程和动画?

Javascript打开一个URL +用户输入的文本

javascript - 字符串是小于还是大于包含相同值的整数?

javascript - 将数组从 json 文件传递​​到 Angular 自定义指令

javascript - 如何在第一次点击时禁用Jquery提示保存按钮

javascript - 如何使用 jQuery 验证按钮单击时的文本字段?

javascript - 使用 jQuery/javascript 将 div 的宽度连接到 scrollTop() 值

android - 此 IP、站点或移动应用程序无权使用此 API key 。在 Android 谷歌地图中

javascript - 动态健康栏 - 动态可观察量和依赖关系