Как использовать массив контроллера в js.erb без преобразования массива в строку? - PullRequest
0 голосов
/ 06 ноября 2019

home_controller.rb

    class HomeController < ApplicationController
      def index
        @labels = ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'].to_json.html_safe
      end
    end

_main.js.erb

window.onload = function() {
    var ctx = document.getElementById('fgm').getContext('2d');
    console.log("<%= escape_javascript @labels %>");
    var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: "<%= escape_javascript @labels %>",

журнал консоли браузера

["Red","Blue","Yellow","Green","Purple","Orange"]

отладка браузера

<script type="text/javascript">
    window.onload = function() {
    var ctx = document.getElementById('fgm').getContext('2d');
    console.log("[\"Red\",\"Blue\",\"Yellow\",\"Green\",\"Purple\",\"Orange\"]");
    var myChart = new Chart(ctx, {
    type: 'line',
    data: {
        labels: "[\"Red\",\"Blue\",\"Yellow\",\"Green\",\"Purple\",\"Orange\"]",
        datasets: [{
            label: '# of Votes',

Эта строка - моя проблема:

        labels: "[\"Red\",\"Blue\",\"Yellow\",\"Green\",\"Purple\",\"Orange\"]",

, так как мне нужно, чтобы она не была заключена вцитаты например

        labels: ["Red","Blue","Yellow","Green","Purple","Orange"],

Ответы [ 2 ]

2 голосов
/ 06 ноября 2019

Используйте это:

@labels = ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'].to_json.html_safe

И используйте это так, без окружающих ", и вам не нужно избегать его (он уже очищен от to_json и html_safe):

console.log(<%= @labels %>);
labels: <%= @labels %>,
1 голос
/ 06 ноября 2019

Следующий код должен работать

home_controller.rb

class HomeController < ApplicationController
  def index
    @labels = ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange']
    # You don't need to use to_json and html_safe
  end
end

_main.js.erb

window.onload = function() {
  var ctx = document.getElementById('fgm').getContext('2d');
  labels = <%= raw @labels %> # use raw method
  console.log(labels);
  var myChart = new Chart(ctx, {
  type: 'line',
  data: {
    labels: labels,
...