2013-09-25 2 views
0

Knockout 및 CodeIgniter에서 MySQL 데이터베이스의 모든 사용자를 표시하려고했습니다. 서버에서 json 응답을 받고 있지만 Knockout이 Json 데이터를 표시하지 않습니다.녹아웃 매핑이 self.users를 업데이트하지 않음

나는 점점 계속 :

Uncaught ReferenceError: Unable to parse bindings. Bindings value: text: id Message: id is not defined

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":"[email protected]","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"}]} 

답변

1

매핑에 인수로 allData을 전달하고 있지만 어디에도 정의되어 있지 않습니다. 당신은 data.users 원하는 대신 (하지data 다음 ko.mapping.fromJSON는 값이 observableArray 될 것입니다 하나의 키, users와 함께 하나의 개체를 반환하기 때문에, 당신은 다른 observableArray의 값으로 해당 객체를 사용하려고하는 경우 즉, 녹아웃을 혼동 것 self.users).

0

이 .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']); 
     } 
    }); 
관련 문제