123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960 |
- <ion-header [translucent]="true">
- <ion-toolbar>
- <ion-title>动态</ion-title>
- </ion-toolbar>
- </ion-header>
- <ion-content [fullscreen]="true">
- <div class="post-input">
- <ion-card>
- <ion-card-header>
- <ion-card-title>发布动态</ion-card-title>
- </ion-card-header>
- <ion-card-content>
- <ion-item>
- <ion-input [(ngModel)]="newPostContent" placeholder="写下你的动态..." clearInput></ion-input>
- </ion-item>
- <ion-item>
- <input type="file" (change)="handleFileInput($event)" accept="image/*" />
- </ion-item>
- <ion-button expand="full" (click)="publishPost()">发布动态</ion-button>
- </ion-card-content>
- </ion-card>
- </div>
- <ion-list class="post-list">
- <ion-item *ngFor="let post of posts">
- <ion-avatar slot="start">
- <img [src]="post?.get('user_id')?.avater" alt="Avatar">
- </ion-avatar>
- <ion-label>
- <h2>{{ post?.get('user_id')?.username }}</h2>
- <p>{{ post.get('content') }}</p>
- <img *ngIf="post.get('image_url')" [src]="post?.get('image_url')" style="max-width: 100%;"/>
- <div>
- <ion-button (click)="likePost(post.get('objectId'))">
- <ion-icon [name]="post.liked ? 'thumbs-up' : 'thumbs-up-outline'"></ion-icon>
- {{ post.liked ? '取消点赞' : '点赞' }}
- <!-- <ion-icon slot="start" name="thumbs-up"></ion-icon>
- {{ post.likes.length }} 点赞 -->
- </ion-button>
- </div>
- <ion-item>
- <ion-input [(ngModel)]="commentInputs[post.get('objectId')]" placeholder="写评论..."></ion-input>
- <ion-button (click)="commentOnPost(post.get('objectId'), commentInputs[post.get('objectId')])">发送</ion-button>
- </ion-item>
- <ion-list>
- <ion-item *ngFor="let comment of post.comments">
- <ion-avatar slot="start">
- <img [src]="comment?.get('user_id')?.avater" alt="Avatar">
- </ion-avatar>
- <ion-label>
- <h2>{{ comment?.get('user_id')?.username }}</h2>
- <p>{{ comment.get('content') }}</p>
- </ion-label>
- </ion-item>
- </ion-list>
- </ion-label>
- </ion-item>
- </ion-list>
- </ion-content>
|