Как получить переменную контроллера rails в файле js

#javascript #ruby-on-rails-4 #instance-variables

#javascript #ruby-on-rails-4 #экземпляр-переменные

Вопрос:

У меня есть переменная в контроллере rails, например

 def index
@approveflag = true
end
 

Мне нужно получить доступ к этой переменной в моем коде javascript, я использовал код, приведенный ниже
в index.html.erb

 <script>
alert("<%=@approveflag%>")
<script>
 

Он отлично работает с результатом «true».Но когда я переместил этот код в соответствующий файл .js, он выдает предупреждение со строкой результата «»<%=@approveflag%>»».
В чем причина. Как я могу это решить?

Заранее спасибо.

Ответ №1:

Лично мне не нравится смешивать js с erb, поэтому я бы сделал что-то вроде этого:

в index.html.erb

 <%= content_tag :div, '', id: 'mycontainer', data: { source: @approveflag } %>
 

в js

 $('#mycontainer').data('source')
alert($('#mycontainer').data('source'))
 

И если у вас есть значение из этой переменной экземпляра, вы можете добавить атрибут данных в link_to, если хотите.

Комментарии:

1. Насколько я пробовал, это должно быть так: <%= content_tag:div, «, id: ‘mycontainer’, данные: { источник: @approveflag } %>

2. Без jQuery: document.getElementById('mycontainer').dataset.source

Ответ №2:

Вы не можете использовать js файлы для этого, они являются частью конвейера ресурсов, они компилируются / сжимаются и предпочтительно загружаются только один раз вашим клиентом (браузером). Поэтому они не должны меняться. Таким образом, во время предварительной компиляции js-файлов переменная экземпляра не установлена и в любом случае не имеет никакого смысла.

Но есть несколько вариантов.

Вы можете объявить переменную javascript в своем представлении, которую может использовать ваш javascript (для глобальных данных)

Код (я использую haml):

 :javascript
  var approveFlag = #{@approveflag} ;
 

Вы можете объявлять теги данных для элементов, если данные принадлежат определенному элементу. Но, например, вы также можете data использовать -tag для body элемента

Например

 %body{:'data-approveflag' => @approveflag}
 

Или что-то вроде

 = link_to 'Collapse', '#', 'data-collapse-div' => 'class-to-collapse'
 

В качестве альтернативы вы можете использовать ajax / json для загрузки данных. Это чисто, но добавляет дополнительную задержку, поэтому делайте это только в том случае, если данные не требуются немедленно.

Ответ №3:

Я рекомендую вам использовать драгоценный камень ‘gon’

Обычно я больше ориентируюсь на прямые варианты, которые не подразумевают установку, но, поверьте мне, использование ‘gon’ очень прямое и чистое

В вашем Gemfile добавьте следующие строки

 # To use controller variables as javascript variables
gem 'gon'
 

Выполните установку пакета, чтобы получить / установить драгоценный камень

В вашем app/views/layouts/application.html.erb добавьте следующую строку

 <%= include_gon %>
 

Затем в вашем контроллере передайте вашу переменную в gon так просто, как это

 gon.your_variable = @controller_variable
 

И в ваших javascripts извлеките вашу переменную (в данном случае для отображения предупреждения).

 alert (gon.your_variable) ;
 

И это все !

Дополнительные примеры и подробности см. на вики-странице — https://github.com/gazay/gon/wiki

Комментарии:

1. Спасибо! ‘gon’ — это здорово!

Ответ №4:

В моем проекте мне иногда нужны переводы, связанные с пользовательским языком. Итак, что я сделал, я создал простой js-файл для хранения локализованного текста:

 var TRANSLATION_ARRAY = []

function store_translation(key, value) {
  TRANSLATION_ARRAY[key] = value
}

function get_translation(key) {
  return TRANSLATION_ARRAY[key]
}
 

В den index.html.erb или других компонентах я делаю это для хранения локализованного текста:

 store_translation('text_id', "<%= translate_with_user_language('text_id') %>")
 

В моем обычном файле js, расположенном в app / assets / javascripts, я получаю локализованный текст с помощью:

 get_translation('text_id')
 

Работает очень хорошо. Вы можете использовать этот подход и для других целей, а не только для переводов.