Now the articles' page could display its comments (view-only, cannot-edit)

Author: codingEzio

chapter08/articles/migrations/0004_auto_20181204_0734.py

@@ -0,0 +1,19 @@
+# Generated by Django 2.1.3 on 2018-12-04 12:34
+
+from django.db import migrations, models
+import django.db.models.deletion
+
+
+class Migration(migrations.Migration):
+
+    dependencies = [
+        ('articles', '0003_comment'),
+    ]
+
+    operations = [
+        migrations.AlterField(
+            model_name='comment',
+            name='article',
+            field=models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='comments', to='articles.Article'),
+        ),
+    ]

chapter08/articles/models.py

@@ -18,9 +18,19 @@ def get_absolute_url(self):
 
 
 class Comment(models.Model):
-    article = models.ForeignKey(Article, on_delete=models.CASCADE)
+
+    article = models.ForeignKey(
+        Article,
+        on_delete=models.CASCADE,
+        related_name="comments",
+    )
+
     comment = models.CharField(max_length=140)
-    author = models.ForeignKey(get_user_model(), on_delete=models.CASCADE)
+
+    author = models.ForeignKey(
+        get_user_model(),
+        on_delete=models.CASCADE
+    )
 
     def __str__(self):
         return self.comment

chapter08/templates/article_list.html

@@ -13,15 +13,24 @@
                 <span class="text-muted">by {{ article.author }} | {{ article.date |date:"M d Y" }}</span>
             </div>
 
-            <div class="card-body">
-                {{ article.body }}
-            </div>
-
-            <div class="card-footer text-center text-muted">
+            <div class="card-body">  
+                <p>{{ article.body }}</p>
                 <a href="{% url 'article_edit' article.pk %}">Edit</a> | 
                 <a href="{% url 'article_delete' article.pk %}">Delete</a>
             </div>
 
+            <div class="card-footer">
+                {% for comment in article.comments.all %}
+                    <p>
+                        <span class="font-weight-bold">
+                            {{ comment.author }} &middot;
+                        </span> 
+
+                        {{ comment }}
+                    </p>
+                {% endfor %}
+            </div>
+
         </div>
 
         <br/>