2009-12-12 28 views
20

Tôi có mẫu của phong cách nàyDjango: Đi qua lập luận để cha mẹ mẫu

project 
- main_templates (including nav bar) 
-- app1 
--- app1_base_template 
--- app1_templates 
-- app2 
--- app2_base_template 
--- app2_templates 

Vì vậy, khi vẽ, app2_templates kéo dài app2_base_template kéo dài main_template.

Những gì tôi cần làm, là có mục điều hướng tương ứng được in đậm khi mẫu của ứng dụng đang được hiển thị (để hiển thị người dùng đang ở đâu).

Cách dễ nhất là nếu tôi có thể chuyển một biến trong phần {% block xxx%}. Điều này có khả thi không?

Có những cách chung khác nào?

+0

Bạn đã kiểm tra điều này chưa? http://stackoverflow.com/questions/1024168/django-is-there-a-better-way-to-bold-the-current-page-link – rinti

+2

Giải pháp CSS đó trông rất khó để duy trì và yêu cầu thêm thông tin ở 3 địa điểm khác nhau. – Boris

Trả lời

41

Bạn đã thử thẻ mẫu {% with%} chưa?

{% block content %} 
    {% with 'myvar' as expectedVarName %} 
    {{block.super}} 
    {% endwith %} 
{% endblock content %} 
+0

Xin lỗi, không rên rỉ điều này. Điều này là trong base.html, và là 'block.super' có nghĩa là để tham khảo navbar ...? Tôi có navbar của tôi bao gồm trong cơ sở của tôi, * sau đó * của tôi 'khối nội dung' ... Làm thế nào nó phải được thiết lập cho điều này để làm việc? – Pureferret

+3

Hack thú vị nhưng không phải là giải pháp đầy đủ. Khuôn mẫu cha mẹ cần được chủ yếu được bao quanh với '{% block content%}' để làm việc này và điều này ngăn cản tôi ghi đè lên một khối khác bên trong 'nội dung'. – Kos

+0

Cú pháp thay đổi trong Django 1.11+, ngay cả khi cú pháp cũ vẫn được hỗ trợ: https: //docs.djangoproject.com/en/1.11/ref/templates/builtins/#with. {% With 'myvar' as expectedVarName% } => {% với expectedVarName = 'myvar'%} – ThePhi

2

Các biến từ mẫu gốc được tự động đưa vào phạm vi của trẻ. Tiêu đề của bạn nói rằng bạn muốn chuyển một biến cho phụ huynh, điều này không có ý nghĩa, vì bạn không thể xác định các biến trong các mẫu. Nếu bạn cần nó một biến trong cả cha và con, chỉ cần khai báo nó trong khung nhìn.

8

Không có cách nào trực tiếp để chuyển biến lên cây kế thừa mẫu theo cách bạn mô tả. Cách mọi người triển khai thanh điều hướng làm nổi bật trang hiện tại thường được điều chỉnh theo bản chất của trang web. Điều đó nói rằng, tôi đã nhìn thấy hai cách tiếp cận chung:

Các công nghệ thấp tiếp cận

Vượt qua một biến trong mẫu bối cảnh đó cho thấy tab nào hoạt động:

# in views.py 
def my_view(request): 
    return render_to_response('app2_template.html', {"active_tab": "bar"}, 

<!-- Parent template --> 
<div id="navigation"> 
    <a href="/foo" {% ifequal active_tab "foo" %}class="active"{% endifequal %}>Foo</a> 
    <a href="/bar" {% ifequal active_tab "bar" %}class="active"{% endifequal %}>Bar</a> 
</div> 

càng cao cách tiếp cận công nghệ

Triển khai custom template tag để hiển thị thanh điều hướng của bạn. Để thẻ có biến cho biết phần nào đang hoạt động:

<!-- Parent template --> 

<div id="navigation">{% block mainnav %}{% endblock %}</div> 

<!-- any child template --> 
{% load my_custom_nav_tag %} 
{% block mainnav %}{% my_custom_nav_tag "tab_that_is_active" %}{% endblock %} 

Bạn có thể phát điên từ đó. Bạn có thể thấy rằng ai đó đã thực hiện một cái gì đó mà sẽ làm việc cho bạn trên djangosnippets.org.

+0

+1 cho phương pháp công nghệ cao. Cho tôi một số nghiên cứu để có được nó làm việc, một số xây dựng và tài liệu tham khảo về những tập tin để đặt nơi sẽ giúp một số người trong tương lai. – SpiRail

1

Đáng buồn là tôi không thể tìm thấy một cách rõ ràng.

Đã kết thúc đặt một thẻ trong base.html của mỗi ứng dụng: (.. Trên thực tế tôi sử dụng hai Một bộ do cơ sở ứng dụng cho các nav chính Một thiết lập bởi các trang ứng dụng cho thanh nav ứng dụng của)

<span class="main_nav_bar_hint" id="2"></span> 

và một chút JQuery kỳ diệu trong dự án base.html

$(document).ready(function() { $("#nav_menu_" + $(".main_nav_bar_hint").attr("id")).removeClass("normal").addClass("selected"); }) 

của nó một chút của một hack, nhưng cách này dễ dàng của mình để hiểu và tôi chỉ cần thay đổi logic ứng dụng một lần nữa được thêm vào.

2

Không có khả năng vượt qua args khi đưa vào mẫu là một trong nhiều lỗi của hệ thống mẫu Django.

Tôi đã phải đối phó với một vấn đề gần như giống hệt nhau: Mẫu lồng nhau sâu cần thiết để làm cho các mẫu phụ huynh định dạng/đánh dấu khác nhau.

giải pháp có thể:

  1. Sử dụng một "siêu bối cảnh" thói quen mà đặt ra một số các giá trị dựa trên nơi trong hệ thống cấp bậc bạn đang có. I E. super_context = MySuperContext (yêu cầu, các giá trị khác, v.v.), trong đó super_context là một dict bạn chuyển đến khung nhìn (hoặc tới RequestContext). Đây là cách tiếp cận Django-thnonic nhất (?), Nhưng nó có nghĩa là logic trình bày đã được đẩy lùi trở lại vào các khung nhìn, điều đó cảm thấy sai với tôi.

  2. Sử dụng thẻ mẫu expr để đặt giá trị trong các mẫu cấp thấp hơn. Lưu ý: điều này chỉ hoạt động khi bạn {% include%} mẫu vì nó phải được đánh giá trước khi đưa vào xảy ra. Bạn không thể làm điều đó với {% extends%} vì đó phải là điều đầu tiên trong mẫu con.

  3. Chuyển sang Jinja2 tạo khuôn mẫu, ít nhất là cho các chế độ xem nơi bạn cần thực hiện việc này.

Một khi bạn đã thiết lập các giá trị bạn có thể làm những việc như thế này:

<div class="foo{% if foo_active%}_active{%endif%}"> stuff </div> 

Điều này làm cho div class "foo" khi nó không hoạt động và "foo_active" khi nó được. Phong cách để hương vị, nhưng không thêm quá nhiều quế. :-)

2

tôi đã lấy cách tiếp cận "công nghệ thấp" Jarret Hardie trong một tương tự, err ... bối cảnh (có, đó là một sự chơi chữ ... mà sẽ không có ý nghĩa hoàn hảo để bạn trừ khi tôi nói với bạn rằng tôi không làm điều hướng nhưng đặt màu đường viền của các nút để hiển thị cái nào đã được nhấn).

Nhưng phiên bản của tôi hơi nhỏ gọn hơn tôi nghĩ. Thay vì chỉ xác định một thanh hoạt động biến ngữ cảnh đơn giản trong chế độ xem, tôi trả về một từ điển, nhưng luôn luôn chỉ với một cặp khóa-giá trị: ví dụ: activebar = {'foo': 'hoạt động'}.

Sau đó, trong mẫu tôi chỉ cần viết class = "{{activebar.foo}}" trong neo foo và tương ứng trong các neo khác. Nếu chỉ activebar.foo được định nghĩa là có giá trị "active" thì activebar.bar trong thanh neo sẽ không làm gì cả. Có lẽ "thất bại âm thầm" là nói chuyện Django thích hợp. Và Bob là chú của bạn.

EDIT: Rất tiếc ... một vài ngày đã trôi qua, và trong khi những gì tôi đã viết ở trên đã làm việc cho tôi một vấn đề xuất hiện khi tôi đặt vào thanh điều hướng một neo với một cửa sổ mới làm mục tiêu. Điều đó dường như là nguyên nhân của một trục trặc kỳ lạ: sau khi nhấp vào cửa sổ mới (tab trong Firefox) và sau đó quay lại cửa sổ mới được khởi chạy, các phần của màn hình hiển thị bên dưới thanh điều hướng bị trống bất cứ khi nào tôi di chuyển nhanh di chuột qua các mục trên thanh điều hướng --- mà không cần nhấp vào bất kỳ thứ gì. Tôi đã phải ép buộc một màn hình vẽ lại bằng cách di chuyển thanh cuộn (không phải là một trang tải lại, mặc dù điều đó quá làm việc vì nó liên quan đến một màn hình vẽ lại).

Tôi có quá nhiều lý do để tìm hiểu lý do tại sao điều đó có thể xảy ra. Và có thể tôi đã làm một việc khác khiến cho vấn đề bằng cách nào đó biến mất. Nhưng ... Tôi đã tìm thấy một cách tiếp cận đơn giản hơn đang hoạt động hoàn hảo cho tôi. Trường hợp của tôi là mỗi mẫu con được khởi chạy từ chế độ xem sẽ khiến mục thanh điều hướng được liên kết hiển thị là "hoạt động". Thật vậy, mục thanh điều hướng đó là mục khởi chạy chế độ xem đã khởi chạy mẫu con --- giao dịch thông thường.

Giải pháp của tôi --- chúng ta hãy xem mục điều hướng "đăng nhập" làm ví dụ --- là đặt mục này vào mẫu con chứa biểu mẫu đăng nhập.

{% block login %}active{% endblock %} 

Tôi đặt nó vào bên dưới khối tiêu đề nhưng tôi không cho rằng vị trí này quan trọng. Sau đó, trong mẫu cha mẹ có chứa các định nghĩa navbar, cho thẻ li bao quanh neo cho mục đăng nhập navbar tôi đặt ... tốt, đây là các mã:

<li class="{% block login %}{% endblock %}"><a href="/mysite/login">Login</a></li> 

Vì vậy khi mẫu trẻ được rendered cha mẹ sẽ hiển thị mục thanh điều hướng đăng nhập là hoạt động và Bob vẫn là chú của bạn.

Cách tiếp cận từ điển mà tôi đã mô tả ở trên là để hiển thị dòng của một nút nào đã được nhấn, khi tất cả đều trên cùng một mẫu con. Điều đó vẫn làm việc cho tôi và vì chỉ có một mẫu con là có liên quan, tôi không thấy phương pháp mới của tôi cho navbars sẽ hoạt động như thế nào trong hoàn cảnh đó. Lưu ý rằng với phương pháp mới cho chế độ xem navbars thậm chí không liên quan. Đơn giản hơn!

Các vấn đề liên quan