2013-08-21 52 views
0

我使用RESTAdapter和Ember Data。如何使Ember控制器处理服务器验证错误?我认为这段代码应该在“console.log(todo.errors);”但我不知道如何实现显色所需的模板......如何使Ember控制器处理服务器验证错误?

App.TodosRoute = App.AuthenticatedRoute.extend({ 
    model: function() { 
    return App.Todo.find(); 
    } 
}); 

App.TodosController = Ember.ArrayController.extend({ 
    createTodo: function(todo) { 
    var data = this.getProperties('title', 'priority', 'due_date'); 
    var todo = App.Todo.createRecord(data); 

    var self = this; 

    todo.on('becameInvalid', function(todo) { 
     // show errors on the form. code goes here 
     console.log(todo.errors); 
    }); 

    todo.on('didCreate', function() { 
     // render list. code goes here 
     self.set('title', ''); 
     self.set('priority', ''); 
     self.set('due_date', ''); 
    }); 
    todo.save(); 
    } 
}); 

<script type="text/x-handlebars" data-template-name='todo/_edit'> 
    {{input type='number' class="input" placeholder="Priority" value=priority}} 
    {{input class="input" placeholder="What needs to be done?" value=title}} 
    {{input type='date' class="input" placeholder="Due date" value=due_date}} 
</script> 

<script type="text/x-handlebars" data-template-name="todos"> 
    <section id="todoapp"> 
    <header id="header"> 
     {{partial 'todo/edit'}} 
     <button {{action "createTodo"}}>Save</button> 
    </header> 

     <section id="main"> 
     <ul id="todo-list" class="sortable"> 
      {{#each controller itemController='todo'}} 
      {{#unless isNew}} 
       <li {{bindAttr class="isEditing:editing"}} data-id="{{unbound id}}"> 
       {{#if isEditing}} 
        {{partial 'todo/edit'}} 
        <button {{action "saveTodo"}} class="save-button">Save</button> 
       {{else}} 
        <label>{{priority}}</label> 
        <label>{{title}}</label> 
        <label>{{date due_date}}</label> 
        <button {{action "editTodo"}} class="edit-button">Edit</button> 
        <button {{action "removeTodo"}} class="destroy">Delete</button> 
       {{/if}} 
       </li> 
      {{/unless}} 
      {{/each}} 
     </ul> 
     </section> 
    </section> 
</script> 

回答

0

最后我得到了这样的代码:

App.TodosNewController = Ember.ObjectController.extend({ 
    create: function() { 
    var data = this.getProperties('title', 'priority', 'due_date'); 
    var todo = App.Todo.createRecord(data); 

    var self = this; 

    todo.on('becameInvalid', function(todo) { 
     self.set('model', todo); 
    }); 

    todo.on('didCreate', function() { 
     self.set('priority', ''); 
     self.set('title', ''); 
     self.set('due_date', ''); 
     self.transitionToRoute('todos'); 
    }); 
    todo.save(); 
    } 
}); 

希望,这将帮助别人