淘汰赛映射不更新 self.users答案

【问题标题】：Knockout Mapping not updating self.users淘汰赛映射不更新 self.users
【发布时间】：2013-09-30 11:48:18
【问题描述】：

试图在 Knockout 和 CodeIgniter 中显示 MySQL 数据库中的所有用户。我从服务器收到了 json 响应，但 Knockout 没有显示 Json 数据。

我不断得到：

未捕获的 ReferenceError：无法解析绑定。绑定值：文本：id 消息：id 未定义

HTML：

<!-- Users -->
<table class="table table-condensed table-striped table-bordered table-hover">
    <thead>
        <tr><th>User Id</th><th>Name</th><th>Email</th><th>Role</th></tr>
    </thead>
    <tbody data-bind="foreach: users">
        <tr>
            <td data-bind="text: id"></td>
            <td><input data-bind="value: name" /></td>
            <td><input data-bind="value: email"/></td>
            <td><select data-bind="options: $root.roles, value: role, optionsText: 'role', optionsValue: 'role'"></select></td>
            <td><a href="#" data-bind="click: $root.removeUser" class='icon-remove'></a></td>
        </tr>         
        </tr>
    </tbody>
</table>


<pre data-bind="text: ko.toJSON($data, null, 2)"></pre>

淘汰赛：

<script type="text/javascript">
    function User(data) {
        this.name = ko.observable(data.name);
        this.email = ko.observable(data.email);
        this.id = ko.observable(data.id);
        this.role = ko.observaveble(data.role);
    }

    function UserListViewModel(data) {
        // Data
        var self = this;
        self.users = ko.observableArray([]);


        // Operations
        self.addTask = function() {
            self.tasks.push(new Task({title: this.newTaskText()}));
            self.newTaskText("");
        };
        self.removeTask = function(task) {
            self.tasks.remove(task)
        };

        // Load initial state from server, convert it to Task instances, then populate self.tasks
        $.get("/sws/users/index", function(data) {
            var mappedUsers = ko.mapping.fromJSON(allData);
            self.users(mappedUsers);
        });
    }

    ko.applyBindings(new UserListViewModel());
</script>

Json：

{"users":[{"id":"1","email":"example@gmail.com","password":"tacos","permissions":null,"activated":"1","activation_code":null,"activated_at":"2013-09-23 20:19:42","last_login":"2013-09-23 20:19:42","persist_code":null,"reset_password_code":null,"name":"Chris","created_at":"2013-09-23 04:17:24","updated_at":"2013-09-23 07:16:23"}]}

【问题讨论】：

标签： php json codeigniter knockout.js knockout-mapping-plugin

【解决方案1】：

您将 allData 作为参数传递给映射，但它没有在任何地方定义。你想要data.users 而不是（不是 data 因为ko.mapping.fromJSON 将返回一个带有一个键的单个对象users，其值将是observableArray；如果你会混淆Knockout您尝试将该对象用作另一个observableArray 的值，即self.users）。

【讨论】：

【解决方案2】：

切换到这个 .ajax 调用似乎可以解决问题。

// Load initial state from server, convert it to User instances, then populate self.users
    $.ajax({
        url: '/sws/users/index',
        dataType: 'json',
        type: 'POST',
        success: function (data) {
            self.users(data['users']);
            console.log(data['users']);
        }
    });

【讨论】：