ryanlabouve / todomvc-embercli

TodoMVC created with embercli

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

ObjectController depracated in ember 1.11

jklapuch opened this issue · comments

Hi,
I tried to change todo controller and index.hbs for ember 1.11. without success.

controllers/todo.js
export default Ember.ObjectController.extend ->
export default Ember.Controller.extend

templates/todos/index.hbs
{{#each todo in model ItemController="todo"}} ->
{{#each todo in model controller="todo"}}

complete index.hbs:

    {{#each todo in model controller="todo"}}
  • {{#if todo.isEditing}} {{edit-todo class="edit" value=todo.title focus-out="acceptChanges" insert-newline="acceptChanges"}} {{else}} {{input type="checkbox" checked=todo.isCompleted class="toggle"}} {{todo.title}} {{/if}}
  • {{/each}}

But actions from todo controller "did not exist". It seems the todo controller is not assigned to todos. What is wrong? Thanks.

Source: http://emberjs.com/deprecations/v1.x/#toc_objectcontroller

BTW: Really nice video tutorial

Cool! Thanks for posting this issue. I should have some time to update over the weekend.

Perfect, I'm very curious about it.

Hey, I'm struggling with this also. I've been going through various posts that I've found (https://gist.github.com/samselikoff/1d7300ce59d216fdaf97) but still not having much luck. @Meph- did you get round to finding a solution now ObjectController is being depreciated?

@Meph- @tomgatzgates I had the same problem as both of you. I believe the solution is the following in your app/templates/todos/index.hbs (note the itemController, todo.model.title and todo.model.isCompleted):

<ul id="todo-list">
  {{#each todo in model itemController="todo"}}
  <li {{bind-attr class="todo.isCompleted:completed todo.isEditing:editing"}}>
    {{#if todo.isEditing}}
      {{edit-todo class="edit" value=todo.model.title focus-out="acceptChanges" insert-newline="acceptChanges"}}
    {{else}}
      {{input type="checkbox" checked=todo.model.isCompleted class="toggle"}}
      <label {{action "editTodo" on="doubleClick"}}>{{todo.model.title}}</label><button {{action "removeTodo"}} class="destroy"></button>
    {{/if}}
  </li>
  {{/each}}
</ul>

I found this example from the deprecation warning link and then following that to the PR to the Ghost project. One of the diffs is an example of using an itemController (linked directly above).

As I'm an ember beginner I don't think I could explain what is going on to make it work. My guess is that todo.model explicitly references the controller's model rather than by proxy. I could also be 100% wrong.

Also thanks @ryanlabouve for the video and code to help me get started with ember. They have been very helpful.