高見龍

iOS app/Ruby/Rails Developer & Instructor, 喜愛非主流的新玩具 :)

Template

上一章我們學到了怎麼設定網址跟對應的action,但畫面的呈現不可能永遠只有一個Hello BookStore!這麼美好。很多時候程式設計師是需要跟美術設計師合作的,通常的流程是工程師會從設計手上拿到HTML + CSS的檔案,如果你曾經用PHP開發過網站,我猜大概你可能是把拿到的.html改成.php,然後開始HTML裡面塞PHP程式碼。Django的MTV架構也差不多,而且Django雖然是Python寫的,但不同的是你不可以在Template裡寫Python的程式碼,你在Template只能用Template提供的API,以及一些filter跟tag(不管是內建或是自己寫的)。

主要的目的就是希望大家不要把以前那種寫義大利程式碼(Spaghetti code)的不良習慣帶來Django。

回來看一下我們原來的book/views.py

1
2
3
4
5
6
7
from django.http import HttpResponse

def index(request):
  return HttpResponse("Hello BookStore!")

def detail(request, book_id):
  return HttpResponse("Book ID = %s" % book_id)

接著我們把原本的HttpResponse改寫成:

1
2
3
4
5
6
7
8
from django.http import HttpResponse
from django.shortcuts import render_to_response

def index(request):
  return render_to_response('book/index.html')

def detail(request, book_id):
  return HttpResponse("Book ID = %s" % book_id)

如果你有注意到shortcuts字樣,應該不難猜得出來因為這個功能太常用了,所以本來其實要寫一堆東西(例如要用loader把template抓出來,再把結果render出來),變成一行render_to_response就搞定,我很偷懶,所以平常幾乎都是用render_to_response就夠了。

你可能會好奇,這個book/index.html要放在哪裡? 先等等,我們先改個設定,請打開專案根目錄的settings.py,在TEMPLATE_DIRS裡加一些東西:

1
2
3
4
5
6
TEMPLATE_DIRS = (
    'templates',
    # Put strings here, like "/home/html/django_templates" or "C:/www/django/templates".
    # Always use forward slashes, even on Windows.
    # Don't forget to use absolute paths, not relative paths.
)

設定這個的目的是要告訴Django要去哪邊取得template的檔案,這裡我設定了templates。接著,我們要來自己在專案根目錄底下建立一個templates的資料夾,然後結構像這樣:

image

原來的這行程式碼:

return render_to_response('book/index.html')

就會知道去哪邊找index.html這個檔案了。

這樣一來,你從設計那邊拿到的HTML檔案,就可以依照像index.html這樣的規則來擺放了。

Template API

前面提到,在Template裡不可以放Python的程式碼,只能放Template提到的API。什麼是Template API? 我直接從Django官網文件偷一小段程式碼來看:

Template API Demo (template_api_demo.py) download
1
2
3
4
5
6
7
8
9
{% if latest_poll_list %}
    <ul>
    {% for poll in latest_poll_list %}
        <li><a href="/polls/{{ poll.id }}/">{{ poll.question }}</a></li>
    {% endfor %}
    </ul>
{% else %}
    <p>No polls are available.</p>
{% endif %}

你看到的這些程式碼,是可以寫在.html裡的,反正到時候Django會把.html當做Template讀出來之後再解析它,最後把內容render給使用者看。

if .. else ..來說,因為在HTML裡沒辦法對齊(就算對齊了萬一被設計師拿回去改過回來可能又不齊了),所以Template API要用一個結束標記,告訴Django說這個if已經在這裡結尾了。

在Template裡,如果看到{% .. %}的,表示它是一個邏輯運算或是語法,通常不會有輸出值;而看到{{ .. }}的話,就是會把裡面的值給吐出來餵在HTML裡的。

Template API很多,在繼續往下之後,請你先看一下https://docs.djangoproject.com/en/1.3/ref/templates/api/這份資料,知道一下Template API是怎麼一回事,又跟一般的Python程式碼有什麼不同?

大概看過之後,接著我們來看看怎麼樣把資料給丟到Template裡呈現出來。

Comments