21 Django template language. Рендеринг шаблона.

Category: N/A

Transcript

00:00

итак на предыдущем уроке мы с вами узнали как django осуществляет поиск шаблонов и узнали в какой структуре нужно это хранить сегодня давайте наконец-то мы с вами обсудим как создавать динамический html потому что все что у нас сейчас написано вот этот

00:15

весь html будет отображаться для каждого знака зодиака вот он отображается для ios также он будет отображаться для льва и всех остальных мы бы хотели чтобы здесь выводилось информация в зависимости от того какой знак зодиака

00:30

нам приходят в рот и для этого нам понадобится janka тимплей тлен вич то есть язык шаблонов жан де и идея заключается в следующем нас есть обычный синтаксис html внутри него мы можем встраивать специальный синтаксис джанга

00:46

template ленгвич о нем мы поговорим уже в дальнейшем и сюда мы можем также добавить данные которые придут нам с бэг-энда и вот все вместе вот это нам позволит создавать динамические страничке или динамические hdmi которые мы в конце концов потом вернем

01:02

пользователя вот такая простая идея и давайте начнем это реализовывать смотрите место всей этой строки в нашем html мы хотим подставить значение которое нам придет из description мы уже создавали такую переменную давайте и

01:19

даже скопирую вот и получали мы ее следующим путём мы обращались к словарю зодиак зиг и через метод get доставали описание нашего знака зодиака но теперь

01:34

нам нужно как то это перемены передать внутрь нашего шаблона и вот здесь на помощь нам приходит окрас функция рендер смотрите я нажимаю контру и кликаю по название этой функции она принимает здесь несколько параметров два

01:49

из них мы уже с вами передали а вот третий параметр контекст в него так раз можно передавать данные видят словаря и эти данные они пойдут внутрь нашего шаблона и там уже будут каким-то образом обрабатываться давайте я продемонстрирую

02:06

как итак мы создадим сперва словарик и в словаре я должен создать ключ давайте назовем это description и добавим слова зодиак чтобы мы этот ключ могли отличить от

02:22

перемены description который содержится описание знака зодиака далее мы эту переменную передаем в качестве третьего аргумента то есть мы можем записать через запятую просто здесь дата это первый вариант либо явно указать что

02:40

контекст это именованный аргумент нашей функции рендер вот и его здесь имя так вот мы в контексте передаем дату и так это первый этап передача данных второй этап это обработать эти данные потому

02:56

что у нас сейчас выводится текст дискрипшн я указал его здесь так вот теперь важно понимать следующее вот этот словарь и который мы с вами передаём в нем важные ключи вот эти ключи они будут являться переменами внутри вашего

03:13

шаблона и к ним можно обращаться давайте я кричу скопирую и обращение идет следующим образом вы должны будете этот ключ обернуть вот в эти фигурные скобки причем двойные то есть это очень похожа на и в строку

03:29

только нужно писать двойные скобки вот пробела который я расставил необязательные но я поставил их для красоты и теперь смотрите я обновляю наше приложение и мы видим наш результат то есть еще раз давайте я перемещу

03:46

наш html ниже и посмотрим на views вот этот ключ он будет являться названием вашей переменной внутри html и к нему вы можете обращаться указав при этом специальные знаки этого такие фигурные

04:02

двойные скобки если вдруг вы переименовываете этот ключ давайте назовем его дискрипшн обновляем страничку видите никакой ошибки в самом аж тем или нет мы даже можем посмотреть если ошибки в

04:18

консоли обновляем нет никаких ошибок но при этом отображение этого ключа тоже нет так вот если здесь ключ меняете то его шлем или тоже нужно это изменить вот обновляем приложение видим сразу результат

04:36

также обратите внимание сама структура html тоже динамически изменяется вот видите мы здесь подставляем значения указаны из description если мы будем обращаться к другому знаку зодиака то у нас динамически изменится контент

04:53

нашей страничке и вот таким вот образом через контекст функции render мы можем передавать данные и там их обрабатывать вот таким вот образом и в этом словарики вы можете передать сколько угодно ключей

05:10

давайте я продублирую и допустим по влияем на вот этот тайтл смотрите у нас здесь водится гороскоп давайте здесь добавим слова для и укажем какой знак зодиака нас интересует то есть я опять же ставлю такие двойные

05:26

фигурные скобки и давайте такую перемену используем как sein словаре мы обязательно должны ее тоже объявить i say нам у нас будет являться вот это перемены сайт зодиак

05:42

давайте обновим страничку и вот смотрите у нас здесь поставилась вот это значение с давайте сделаем чтобы она была с большой буквы для этого я могу здесь вызвать

05:57

метод тайтл обновляем и вот видим результат если мы перейдем во льва то у нас также изменится заголовок и давайте создадим еще парочку ключей в этом словаре и заодно посмотрим как

06:14

будут отображаться разные типы данных в нашем шаблоне для этого давайте я передам список он пойдет в ключ лист давайте заодно создадим кортеж над названием переменной я долго думать

06:30

не буду просто но зовут май пипл ну давайте здесь будет побольше значений дальше нам интересно увидеть что из себя будет представлять словарь давайте это будет словарь который содержит глючные

06:47

там будет строка джек и его возраст допустим 40 также давайте посмотрим как будет отображаться целое число и вещественное

07:06

код давайте отформатируем и осталась название этих переменных в отобразить в шаблоне для этого давайте я на новой строчке создам т.п. и здесь напишем число и подставляя параметры число и это у нас

07:21

будет моим обновляем и вот видим у нас 11 отображается давайте здесь мы выведем моей float добавим слова вещественное

07:39

дальше мы выведем список это ключевой лист дальше мы выведем кортеж и еще останется нам словарик не забываем здесь менять название ключей

07:55

и смотрим как это отображается носа и вот смотрите все эти типы данных мы можем спокойно вывести с вами на экране причем список кортежей словари выводится вместе со своими скобками и давайте

08:11

здесь словаре попробуем добраться до крича ней для этого давайте я здесь поставлю запятую пишем ключ и также обращаясь к переменной она у нас называется мой дик и мы знаем что по ключу нужно обращаться в квадратных скобках и дальше пишите

08:28

название ключа пробы и здесь мы получаем ошибку вот эту инструкцию django не может распарсить и решается это следующим образом в шаблонах чтобы обратиться к личу словаря вы должны будете не в квадратных скобках писать

08:44

она премьера классов то есть вы указываете обращение через точку то есть словари . ключ вот таким вот образом вы можете добраться до ключа здесь обращение прям как у экземпляров класса ну и давайте раз могла сах

09:00

заговорили тоже попробуем их отобразить для этого я создам да да класс давайте здесь вот недалеко от нашей функции чтобы мы могли все видеть это

09:19

будет небольшой даты класс у нас всего лишь будет там два поля name это строковые и речь это целое давайте я нижнюю часть закроем чтобы вы

09:35

могли все видеть здесь итак я дублирую эту строчку давайте перемены у нас будет называться michael's и здесь мы создаем экземпляр класса перса имя у него будет вилл и возраст давайте укажем 55 и

09:54

в инфо зодиак я дублирую параграф здесь пишу экземпляр класса и указываем название michael's ключ нам не нужен и все давайте обновим страничку и вот

10:10

видим как наш даты класс отображаются здесь стоит отметить что на отображение любого вашего экземпляра класса который вы создали будет влиять метод стр провели сказать магический метод стр вот и вы его в праве конечно же поправить

10:25

давайте мы с вами это сделаем и кстати по классам если вы с ними не знакомы можете посмотреть мой отдельный плейлист и или записаться на курс степи к я там подробно рассказывал что это такое и так же говорил про этот метод магический стр так вот здесь мы можем

10:41

вернуть строку который будет заменять вот это отображение вот это и давайте мы здесь вернем фразу вис ис и название нашего человека значит мы обращаемся с elf . мы

10:58

обновляем страничку и вот видим здесь у нас возвращается строка так раз ту которую мы прописали и здесь подставляется ими человеком и давайте попробуем достучаться до возраст этого человека для этого вам нужно к

11:14

этой переменной через точку указать возраст обновляем и вот мы получаем ошибку что у нас django не может это спарсить но на самом деле здесь произошла ошибка потому что я в одних фигурных скобках дважды

11:30

обращаясь переменам смотрите если я вынесу эту переменную в отдельные фигурные скобки то у нас никаких проблем не будет вот сбил вот его возраст и поэтому к атрибутам класса вы можете

11:47

обращаться через точку и напоследок давайте проверим важен ли регистр букв вот я например здесь буква л делаю большой это включи мой лист обновляем страничку видите он пропадает

12:03

поэтому мы делаем вывод что регистр здесь имеет значение также как и в питоне вот с этим быть аккуратным вот я указываю перемены уже с большой буквы обновляю страничку наш список появляется напоминаю что нас топики я создал курс

12:18

по джанки советует удар записаться и там вы можете найти практические задания по этой и по предыдущим темам но она сегодня давайте мы закончим наше занятие а на следующем мы с вами поговорим о фильтрах в шаблонах и расскажу что это такое и как с ними работать

12:33

но на сегодня у меня все увидимся в следующем видео всем пока