django лучший способ передать данные на javascript

Раньше я привязывал свои данные к DOM, пока не обнаружил библиотеки привязки данных. Мой вопрос, скажем, у меня есть таблица, содержащая записи модели, как я могу построить эту таблицу с помощью JS, иначе передайте объекты в javascript, а затем стройте таблицу в шаблоне?django лучший способ передать данные на javascript

так далеко от поиска единственный способ я нашел это такие вещи, как это:

var data = '{{data}}';

{{data}} может быть JSON для этого примера.

, который кажется уродливым и плохим для меня, чтобы разместить код шаблона в javascript, а также мне не нравится идея глобальных переменных в javascript (старый способ и не очень хорошо масштабируется). Это также не позволит мне помещать это во внешний JS-файл. Есть ли лучший (и чистый) способ?

источник

2016-07-29 user3599803

{{data}} - это данные json? http://stackoverflow.com/questions/38620816/django-passing-json-data-to-static-getjson-javascript/38621448 – Igor

Возможный дубликат [Jango Template Variables и Javascript] (http://stackoverflow.com/questions/298772/django-template-variables-and-javascript) – Cory

Так я тоже это делаю, но я не передаю слишком много данных, а всего лишь несколько параметров, которые мне необходимы для инициализации JS-кода. Основные данные передаются через API.

Вы можете передать JSON, если вы хотите, но вы могли бы по крайней мере, очистить data перед визуализацией его в шаблоне с помощью escapejs

var data = '{{data|escapejs}}';

Надеется, что это помогает

источник

2016-07-29 09:17:35 pleasedontbelong

Есть способы аккуратно изолировать поджат сериализованным данные из остальной части вашего кода.

Пример 1 -assigning предварительно загруженные данные в глобальную переменную на window, а затем использовать его в компоненте таблицы:

<html> 
<meta charset="utf-8"> 
<body> 
    <script> 
     // Loading the data for use in JS components here 
     (function() { 
      window.tableData = JSON.parse('{{ table_data }}'); 
     }()); 
    </script> 

    <script src="table.js"></script> 
    <!-- table.js uses window.tableData when building the table --> 
</body>

Пример 2 -encapsulate компонент таблицы в качестве модуля, инициализировать его из основной шаблон и передать предварительно загруженные данные.

<html> 
<meta charset="utf-8"> 
<body> 
    <table id="theTable"></table> 

    <script src="table.js"></script> 
    <!-- table.js exports itself globally as window.table --> 

    <script> 
     // Loading the data and initializing table component 
     (function() { 
      var tableEl = $('#theTable'); 
      var tableData = JSON.parse('{{ table_data }}'); 

      window.table.init(tableData, tableEl); 
     }()); 
    </script> 
</body>

И так далее!

Хотите полностью избежать смешанного языка шаблонов Django и JavaScript?

Передайте все свои данные через XHR-make AJAX-запросы на сервер после загрузки страницы; напишите представление Django, которое возвращает ваши данные как JSON, которые легко анализировать в JavaScript.

Хотите все-держать Django язык шаблонов из и избежать дополнительных XHR следует для извлечения данных?

Посмотрите на создание своего приложения на фреймворке, таком как React.js или AngularJS, и используя компонентный компонент на стороне сервера.

источник

2016-07-29 09:28:50 Tony

На самом деле я изучаю последний предложенный вами метод. серверная рендеринг компонентов - что это, как это работает с django? любая ссылка была бы замечательной. – user3599803

@ user3599803 уверен, что в прошлый раз я наткнулся на https://github.com/markfinger/python-react, README имеет довольно много особенностей интеграции с Django. Не используя его сам еще, он просто разбирался. – Tony

django template autoescape all tags {{}}.

Если table_data уже содержит данные json в теге шаблона. Просто.

<script> 
var myTable = {% autoescape off %}{{ table_data }}{% endautoescape %}; 
</script>

не нужна скобка и цитаты, это массив в JavaScript (например, вар, например = [ 'теста'];)

Если данные не JSON, вернуть его в запросе (рендеринг шаблона). Пример

import json 
from django.shortcuts import render 

def home(request): 
    table_data = MyModel.objects.select_related().values('items1', 'items2') 
    return render(
     request, 
     'main.html', 
     { 
      'table_data': json.dumps(list(table_data)) 
     })

источник

2016-07-29 10:49:36 Igor

django лучший способ передать данные на javascript

ответ

Смежные вопросы