<nz-card id="article-card" [nzLoading]="data==null">
    <h1><a [routerLink]="'/article/'+data.id">{{data.title}}</a></h1>
    <div>
        <span *ngIf="showMediaArea" id="article-original" [ngClass]="data.original?'original':'reproduced'">
            {{data.original ? '原创' : '转载'}}
        </span>
        <span *ngIf="showMediaArea" class="badge">
            <i nz-icon nzType="calendar" nzTheme="outline"></i>
            <span>{{data.publishDateFormat}}</span>
        </span>
        <span *ngIf="showMediaArea" class="badge">
            <i nz-icon nzType="user" nzTheme="outline"></i>
            <span>{{data.authorName}}</span>
        </span>
        <span *ngIf="showMediaArea" class="badge">
            <i nz-icon nzType="file" nzTheme="outline"></i>
            <span>
                <a [routerLink]="'/categories/'+data.category">{{data.category}}</a>
            </span>
        </span>
    </div>
    <p>{{data.summary}}</p>
    <span style="float: right;margin-bottom: 10px">
        <a [routerLink]="'/article/'+data.id">阅读更多<i nz-icon nzType="right" nzTheme="outline"></i></a>
    </span>
    <ng-template [ngIf]="showTagArea&&data.tags.length>0">
        <nz-divider></nz-divider>
        <div>
        <span *ngFor="let tag of data.tags">
            <i nz-icon nzType="tag" nzTheme="outline"></i>
            <a [routerLink]="'/tags/'+tag">{{tag}}</a>
        </span>
        </div>
    </ng-template>
</nz-card>
