python - {{ self.article_title }} タグは、wagtail で Web アプリケーションを表示しませんでした

Question

私が欲しいもの

ニュース配信アプリのようなwebアプリをwegtailで1つ構築していきます。Blocks.py でクラスを作成し、models.py に継承し、html でコーディングして表示しました。タイトルやURLなどの記事情報を入力して一覧表示するクラスです。html をコーディングしたところ認識されましたが、表示されません。

エラーメッセージ

エラーメッセージはありません。この写真をご覧ください。{{ self }} をコーディングして表示しています。 記事のタイトルと詳細情報を確認できます。

詳細に

プロジェクトツリー

これが私のプロジェクトの構成です。 プロジェクトツリー

コーディング

#streams/blocks.py
#python file

#block model to input article info
class ArticleIndexBlock(blocks.StructBlock):
    articles = blocks.ListBlock(
        blocks.StructBlock(
            [
                ("article_image", ImageChooserBlock(required=True)),
                ("article_title", blocks.CharBlock(required=True, max_length=40)),
                ("article_text", blocks.TextBlock(required=True, max_length=200)),
                ("article_url", blocks.URLBlock(required=False)),
            ]
        )
    )

    class Meta:
        template = "streams/article_index_block.html"
        icon = "edit"
        label = "Article"

#articles/models.py
#python file

#models inherited from Streams/blocks.py
class ArticleIndexPage(Page):
    template = "articles/article_index.html"

    content = StreamField(
        [
            ("article_index_block", blocks.ArticleIndexBlock()),
        ],
        null=True,
        blank=True,
    )

    content_panels = Page.content_panels + [
        StreamFieldPanel("content"),
    ]

    def get_context(self, request, *args, **kwargs):
        context = super().get_context(request, *args, **kwargs)
        context["posts"] = ArticleIndexPage.objects.live().public()
        return context

    class Meta:
        verbose_name = "Article index Page"
        verbose_name_plural = "Article index Pages"

<!--article_index.html-->

{% extends 'base.html' %}
{% load wagtailcore_tags %}

{% block content %}
    <h1>{{ self.title }}</h1>


    {% for block in page.content %}
        {% include_block block%}
    {% endfor %}

{% endblock content %}

<!--article_index_block.html-->

<div class="container">
  <h3>{{ self.article_title }}</h3>

</div>

</hr>