我們今天要將資料庫裡面的Data在網頁上呈現
之前有講過了，這邊就快速 Create Photo的 model

# models.py
from django.utils import timezone

class Photo(models.Model):
    title = models.CharField(max_length=100)
    path = models.CharField(max_length=100)
    story = models.TextField()
    create_date = models.DateTimeField(default=timezone.now)

我們需要紀錄title、path(照片位置)、story(圖片背後故事)、建立日期

寫完後，回憶一些build model 的流程

build models -> make migrations -> migrate
這很重要 ! 後面要記得囉 ~

python manage.py makemigrations

python manage.py migrate

在裡面簡單create測試一下

View & DB

我們在View裡import剛剛的model

from classes.models import Photo

接著在index function裡把剛剛create的object帶入

def index(request):
    name = 'Photo House'
    Photos = Photo.objects.all()
    return render(request, 'index.html', locals())

locals() - 顧名思義就是幫你帶入local variable，可以省去很多麻煩

接著我們要把所有Photo相關資訊顯示在首頁，那要用什麼工具呢？

Template tags

先預告，下節會有更好玩的！

使用時機

• 邏輯判斷 - if / else
  • if login 成功 => Display data
  • else => Display login button
• 重複的 code - for loop
  • 列出相同資訊 / 片段
• 格式化 Template 的變數
  • 日期格式化

For loop

還記得寫 Python 若想print出 list 裡的所有元素，我們會用 for X in Y
而在 Django，我們用的是 -- {% for %}

用法

{% for <element> in <list> %}
    ...
{% endfor %}

這邊特別注意用完，要給它 endfor 它才會知道哪裡結束哦

接著就開始改寫index，把需要重複的地方加上for
每個photo都需要把所有資訊叫出來

<div class="row">
    {% for photo in Photos %}
    <div class="col-md-4">
         <h2>{{photo.title}}</h2>
         <img src="{{phto.path}}" alt="">
         <p>{{photo.story}}</p>
         <p>{{photo.create_date}}</p>
    </div>
    {% endfor %}
</div>

因為還沒有什麼內容，只有剛剛create的第一個object

接下來就可以自己進 admin 做CRUD ~
那我們進admin看看

怎麼沒有看到剛新增的Photo
這時候就要去檢查admin.py內有沒有完成註冊

from django.contrib import admin

# Register your models here.
from .models import Teacher,Photo

admin.site.register(Teacher)
admin.site.register(Photo)

確認完成後再回去看admin頁面

成功後可以自己去玩CRUD，看頁面的變化~

Today's final - title/story/date complete

下課囉 ~ 請鎖定 柚子放學後的網頁生活