Python Bottle: Назначение переменной python переменной Javascript

Question

Я использую Bottle веб-фреймворк для рендеринга веб-страниц. Я использую механизм шаблонов бутылок для передачи переменных из Python, а затем обрабатываю их соответственно в файле шаблона, который имеет встроенный код Python.

Теперь проблема возникает, когда я использую javascript в моем шаблоне. Если я пытаюсь получить доступ к моей переменной Python внутри функций javascript, он терпит неудачу с TypeError: unhashable type: 'list'

Я звоню мой шаблон в моем питона файл:

list_vals = [['Mushrooms', 3, 5], ['Onions', 1, 4], ['Olives', 1, 5], ['Zucchini', 1, 2]]  
return bottle.template(os.path.join(os.path.dirname(__file__), 'templates', 'pizzaStats.html'), vals=list_vals) 

В моем файле шаблона Я использую переменную vals в настоящее время только печатать внутри JavaScript, как показано ниже (только сценарий часть шаблона показан):

<script type="text/javascript"> 

    // Load the Visualization API and the piechart package. 
    google.load('visualization', '1.0', {'packages':['corechart']}); 

    // Set a callback to run when the Google Visualization API is loaded. 
    google.setOnLoadCallback(drawChart); 

    // Callback that creates and populates a data table, 
    // instantiates the pie chart, passes in the data and 
    // draws it. 
    function drawChart() { 

    // Create the data table. 
    var data = new google.visualization.DataTable(); 
    %print ({{ vals }}) 
    var graphdata = {{ vals }}; 
    data.addColumn('string', 'Topping'); 
    data.addColumn('number', 'Slices'); 
    data.addColumn('number', 'pieces'); 
    data.addRows(graphdata); 

    // Set chart options 
    // to smoothen the lines - 'curveType':'function' 
    var options = {'title':'How Much Pizza I Ate Last Night', 
        'width':400, 
        'height':300}; 

    // Instantiate and draw our chart, passing in some options. 
    var chart = new google.visualization.LineChart(document.getElementById('chart_div')); 
    chart.draw(data, options); 
    } 
</script> 

Даже если изменить тип переменной от list до dict тип, все еще жалуется. TypeError: unhashable type: 'dict' Ошибка исходит от print(), но если я удаляю print(), ничего не происходит и график не нарисован, что означает, что переменная неправильно назначена.

Конечная цель - назначить эту переменную переменной javascript, которая затем построит график с использованием API Google. Каков правильный способ присвоить переменную Python переменной javascript внутри шаблона бутылки? Благодарю.

Answer 1

Я думаю, что проблема в стороне шаблона, когда вы представляете аргумент vals. Предоставленный vals должен быть действительным кодом JavaScript. По умолчанию флакон авто-экранирует специальные символы HTML, являющиеся одиночными и двойными кавычками среди них. Итак, когда вы передаете список Python list_vals функции template, она оценивается в строку, как это:

"[['Mushrooms', 3, 5], ['Onions', 1, 4], ['Olives', 1, 5], ['Zucchini', 1, 2]]" 

и автоматически спаслась послесловиями бутылок, как это:

[['Mushrooms', 3, 5], ['Onions', 1, 4], ['Olives', 1, 5], ['Zucchini', 1, 2]] 

производит недопустимое JavaScript код.

Быстрое решение может быть только disabling the bottle auto-escaping просто добавив восклицательный знак параметра шаблона vals:

var graphdata = {{!vals}};