Как добавить кнопку в рубиновом вольте?
Я пытаюсь понять, как добавить кнопку в среду ruby Volt - это действительно вопрос для новичка.
Я пытался адаптировать пример задач ( часть 1 и часть 2), но не получил его на работу.
Я не совсем уверен, если я неправильно понял HTML или код контроллера. Любые указатели будут с благодарностью.
watering.html
<button e-click="add_message">Start Watering</button>
<table class="message_table">
{{ _messages.each do |m| }}
<tr>
<td> {{ m.msg }} </td>
<tr>
{{ end }}
</table>
Это действительно помещает кнопку на страницу, но когда я нажимаю ее, я надеялся вызвать следующий код в контроллере, однако ничего не происходит.
main_controller.rb
module Main
class MainController < Volt::ModelController
model :store
...
def add_message
p "### Message triggered ###"
_messages << {msg: "test-msg-01"}
end
end
Я поставил в качестве проверки оператор p - он определенно не срабатывает при нажатии кнопки.
2 ответа
Работаю с помощью @ryanstout - большое спасибо.
Я публикую этот ответ, так как были две простые ошибки, которые могут стать ошибкой, если вы пытаетесь начать работу с средой ruby вольт:
Код контроллера был в порядке, но в html было две ошибки:
- В HTML есть небольшая ошибка, вторая
<tr>
должно быть</tr>
закрыть ряд
Вывод: в настоящее время нет ошибок, генерируемых ни volt (0.9.3), ни версией Firefox, которую я использую для плохо сформированного HTML, но это может помешать работе вашего кода - в этом случае кнопка не работает
- Ссылка на поле переменной итератора требует начального подчеркивания (поэтому m._msg, а не m.msg)
Вывод: подчеркивания необходимы для родительского объекта и его полей
Вот как должен выглядеть HTML:
<button e-click="add_message">Start Watering</button>
<table class="message_table">
{{ _messages.each do |m| }}
<tr>
<td> {{ m._msg }} </td>
<tr>
{{ end }}
</table>
Надеюсь, это помощь кому-то еще.
Это кажется правильным. Но помните - контроллер работает на стороне клиента. Таким образом, вы должны увидеть вывод оператора p в консоли браузера.
Просто чтобы быть уверенным - ваш взгляд живет в app/main/views/main/?