Model impl #7
Model impl #7
Conversation
There was a problem hiding this comment.
Для начала просто попробуй нарисовать пустой экземпляр модели на странице.
Чтобы обновлять данные в html, тебе надо связать модель с представлением через события.
Ты добавил EventEvemiter, используй его.
Что советую сделать (по шагам):
Оберни View в отдельный модуль/класс.
Разбей отображение приложение/список/сущность todo.
Реализуй метод отрисовки (например: render) внутри каждого отображения.
Добавь обработчики действий пользователя внутри view.
Вызывай trigger событий (например из view), чтобы и т.д.
| @@ -0,0 +1,7 @@ | |||
| const Handlebars = require('handlebars'); | |||
|
|
|||
| var source = $("todo").html(); | |||
There was a problem hiding this comment.
Ты обращаешься к элементу по id, а не по тегу. Нужно писать $("#todo")
| const api = require('./api'); | ||
|
|
||
| class Model { | ||
| var store = { |
There was a problem hiding this comment.
В es6 нельзя так инициализировать поля. Их надо заполнять в конструкторе.
| @@ -8,68 +8,82 @@ | |||
| <link rel="stylesheet" href="node_modules/todomvc-app-css/index.css"> | |||
| <!-- CSS overrides - remove if you don't need it --> | |||
| <link rel="stylesheet" href="css/app.css"> | |||
| <script src="js/view.js"></script> | |||
There was a problem hiding this comment.
Скрипт добавлен в страницу, а через browserify ты его не прогнал.
Нужно добавить его сборку в package.json/scripts, либо сделать require в app.js (recommended).
| <span class="todo-count"><strong>0</strong> item left</span> | ||
| <script id="item_left" type="text/x-handlebars-template"> | ||
| <span class="todo-count"><strong>{{left}}</strong> item left</span> | ||
| </script> |
There was a problem hiding this comment.
Лучше описать все шаблоны в одном месте, не вкладывая их в другие элементы. Например в head.
Но лучше вынести их в скрипты. Так твое view станет независимым от документа.
Сделал модель, потом застрял на том, как вообще динамически обновлять данные html, как писать эту связку данных из js в html