Hello everyone again! I got an issue . When i call addTodo method on button click and an error is thrown;
todos.js: ` import Route from “@ember/routing/route”;
import { action } from “@ember/object”;
export default class TodosRoute extends Route {
todos = [
{id: 1, title: "Купить хлеб", completed: false},
{id: 2, title: "Купить масло", completed: false},
{id: 3, title: "Купить молоко", completed: false}
];
model() {
return this.todos;
}
@action
addTodo() {
this.todos.push({id: 4, title: "Купить печенье", completed: false});
}
} `
todos.hbs: ` {{page-title “Todos”}}
<h1>All Todos</h1>
<div class="add-todos">
</div>
<ul>
{{#each @model as |todo|}}
<li>
<strong>{{todo.id}}</strong>
<span>{{todo.title}}</span>
</li>
{{/each}}
</ul>
<button type="button" {{on 'click' this.addTodo}}>Add Todo</button>
{{outlet}} `
issue: `Uncaught Error: Assertion Failed: You must pass a function as the second argument to the “on” modifier, you passed undefined. While rendering:
this.addTodo at assert (index.js:172) at OnModifierState.updateFromArgs (index.js:7161) at OnModifierManager.install (index.js:7388) at runtime.js:4712 at track (validator.js:826) at TransactionImpl.commit (runtime.js:4711) at EnvironmentImpl.commit (runtime.js:4813) at inTransaction (runtime.js:4838) at InteractiveRenderer._renderRoots (index.js:8563) at InteractiveRenderer._renderRootsTransaction (index.js:8615)`