Truy cập danh sách python trong javascript như một mảng

Question

Tôi có điều này trong bình views.py tôi

def showpage(): 
     ... 
     test = [1,2,3,4,5,6] 
     return render_template("sample.html",test=test) 

Tôi có điều này trong mẫu của tôi .html

<script> var counts = {{test}}; </script> 

này mang lại cho tôi một số lượng rỗng biến. Làm thế nào tôi có thể nhận được số lượng giống như danh sách kiểm tra trong python?

Answer 1

1. Khi bạn chèn biến template {{ test }} Mất đại diện đối tượng. Đối với danh sách int [1,2,3,4,5,6], nó sẽ được hiển thị là [1, 2, 3, 4, 5, 6], vì vậy nó là mảng javascript hợp lệ, nhưng phương pháp này không an toàn đối tượng phức tạp mà không có đại diện giống như javascript, ví dụ, test = [1,2,3,4,5, bất kỳ] sẽ hiển thị là [1, 2, 3, 4, 5, <built-in function any>], tuy nhiên đây chỉ là ví dụ và sẽ không bao giờ hoạt động.

2. Để ngầm đúc để javascript đối tượng trong bình tồn tại tojson lọc:

   <script> var counts = {{ test|tojson }}; </script> 
   

   Vì vậy, nếu đối tượng là JSON serializable, sau đó tất cả sẽ được trả lại, nếu không thì template engine sẽ nâng cao một ngoại lệ.

3. Bạn cũng có thể gửi mã javascript để mẫu của bạn:

   from flask import json 
   return render_template("sample.html",test=json.dumps(test)) 
   

   nhưng nó không phải là một phương pháp tốt và nó sử dụng tốt hơn tojson lọc đó cũng là đánh dấu HTML an toàn.

4. Tôi không thích trộn bất kỳ mã javascript nào trong các mẫu và các mẫu phân tách, dữ liệu javascript và javascript với ajax. Nếu phương pháp này khó thì tôi thích sử dụng bộ lọc tojson.

Answer 2

Bạn sử dụng json.dumps trong chế độ xem bình và JSON.parse trong mã javascript.

Trong giao diện python:

def showpage(): 
    ... 
    test = [1,2,3,4,5,6] 
    test = json.dumps(test) 
    return render_template("sample.html",test=test) 

Trong đoạn mã JavaScript:

<script> var counts = JSON.parse("{{ test }}"); </script> 

Answer 3

Bạn cũng có thể sử dụng

{{ test|safe }} 

hoặc

{{ test|tojson|safe }} 

Bộ lọc safe được sử dụng trong thẻ script.