django 가장 좋은 방법은 데이터를 자바 스크립트로 전달하는 것입니다.

데이터 바인딩 라이브러리를 발견 할 때까지 DOM에 내 데이터를 "연결"했습니다. 내 질문에, 모델 레코드가 포함 된 테이블이 있다고 가정 해 봅시다. 예를 들어 JS로 해당 테이블을 작성할 수 있습니까? 예를 들어 자바 스크립트에 객체를 전달하는 대신 템플릿에서 테이블을 직접 빌드 할 수 있습니까?django 가장 좋은 방법은 데이터를 자바 스크립트로 전달하는 것입니다.

지금까지 내가 찾은 유일한 방법은 검색에서이 같은 일이다

var data = '{{data}}';

{{data}}이 예를 들어 JSON 수 있습니다.

나는 추악하고 나쁘게 보입니다. 자바 스크립트에 템플릿 코드를 넣는 것 또한 자바 스크립트에서 전역 변수라는 생각을 좋아하지 않습니다 (예전 방식이고 잘 확장되지 않습니다). 그것도 내가 외부 JS 파일에 넣는 것을 허용하지 않을 것이다. 더 나은 (그리고 깨끗한) 방법이 있습니까?

출처

2016-07-29 user3599803

{{data}} - json 데이터입니까? http://stackoverflow.com/questions/38620816/django-passing-json-data-to-static-getjson-javascript/38621448 – Igor

가능한 [Django 템플릿 변수 및 자바 스크립트] 복제본 (http://stackoverflow.com/questions)/298772/django-template-variables-and-javascript) – Cory

그렇긴하지만 너무 많은 데이터를 전달하지 않고 JS 코드를 초기화해야하는 몇 가지 매개 변수 만 전달합니다. 주요 데이터는 API를 통해 전달됩니다. 당신이 원하는 경우

당신은 JSON을 통과 할 수 있지만 적어도이

출처

2016-07-29 09:17:35 pleasedontbelong

깔끔하게 직렬화 미리로드 분리하는 방법이 있습니다 도움이 escapejs

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

희망을 사용하여 템플릿을 렌더링하기 전에 data를 청소 수 나머지 코드의 데이터

예 1 테이블 성분에서 사용 후에 window에서 전역 변수에 프리로드 데이터 -assigning하고 :

<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을 통해 모든 데이터를 전달하면 페이지가로드 된 후 서버에 AJAX 요청이 전송됩니다. JavaScript에서 구문 분석하기 쉬운 JSON으로 필요한 데이터를 반환하는 Django 뷰를 작성한다.

데이터를 가져올 장고 템플릿 언어 밖으로 및 피할 추가 XHR이 모든 것을이-유지 원하십니까?

React.js 또는 AngularJS와 같은 프레임 워크에서 응용 프로그램을 빌드하고 구성 요소의 서버 측 렌더링을 활용하십시오.

출처

2016-07-29 09:28:50 Tony

실제로 제가 제안한 마지막 방법을 탐구하고 있습니다. 구성 요소의 서버 쪽 렌더링 - 그것은 무엇입니까, 어떻게 장고와 함께 작동합니까? 어떤 레퍼런스라도 훌륭 할 것이다. – user3599803

@ user3599803 내가 마지막으로 https://github.com/markfinger/python-react를 우연히 만났을 때, README는 Django에 특화된 통합에 대해 꽤 많이 알고 있습니다. 아직 사용하지 않고 주위를 연구하고있었습니다. – Tony

django 템플릿 autoescape 모든 태그 {{}}.

table_data가 이미 템플릿 태그의 데이터를 json으로 설정 한 경우 단순한.데이터하지 JSON가 요청 (템플릿 렌더링)에 반환한다면

;

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

브래킷과 인용 필요하지 그것은 (예 VAR 예 = '검사']와 같은) 자바 스크립트 배열이다. 예

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 가장 좋은 방법은 데이터를 자바 스크립트로 전달하는 것입니다.

답변

관련 문제