Takumon/mean-blog

<ng-container *ngIf="!commentAndReplyList">
    <mat-progress-bar mode="indeterminate"></mat-progress-bar>
</ng-container>

<ng-container *ngIf="commentAndReplyList">
  <div class="comment-list">
    <div *ngFor="let comment of commentAndReplyList" class="comment-list__comment comment">
      <img
        class="comment__author-icon"
        lazyLoad="/api/images/avator/{{ user._id}}"
        [offset]="this.Constant.LAZY_LOAD_OFFSET"
        >
      <div class="comment__main">
        <div class="comment__article">
          <img
            class="comment__article__author-icon"
            [routerLink]="['/users', comment.articleId.author.userId, 'articles']"
            lazyLoad="/api/images/avator/{{ comment.articleId.author._id}}"
            [offset]="this.Constant.LAZY_LOAD_OFFSET"
            >
          <div class="comment__article__author-wrapper">
            <span
              class="comment__article__author"
              [routerLink]="['/users', comment.articleId.author.userId, 'articles']"
              >{{comment.articleId.author.userId}}</span>
            <span>の投稿</span>
          </div>
          <div class="comment__article__title-wrapper">
            <span
              class="comment__article__title"
              [routerLink]="['/', comment.articleId.author.userId, 'articles', comment.articleId._id]"
              >{{comment.articleId.title}}</span>
            <span>にコメント</span>
          </div>
          <!-- TODO　記事が削除されている場合のスタイル -->
          <div class="comment__created">{{comment.articleId.updated | date: 'yyyy/MM/dd HH:mm' }}に{{comment.articleId.updated === comment.articleId.created ? '登録' : '更新'}}</div>
        </div>
        <pre [innerHTML]="comment.text" class="comment__text"></pre>
      </div>
    </div>
  </div>
</ng-container>