s202226701049/src/lib/user/model-user-edit/model-user-edit.component.html

<ion-card>
    <ion-card-header>
        <ion-card-title>编辑个人资料</ion-card-title>
        <ion-card-subtitle>完善你的个人信息</ion-card-subtitle>
    </ion-card-header>

    <ion-card-content>
        <ion-item>
            <ion-icon slot="start" name="person-outline"></ion-icon>
            <ion-label position="stacked">用户名</ion-label>
            <ion-input type="text" [value]="userData.username" disabled></ion-input>
        </ion-item>

        <ion-item>
            <ion-icon slot="start" name="person-circle-outline"></ion-icon>
            <ion-label position="stacked">真实姓名</ion-label>
            <ion-input type="text" [value]="userData.realname" (ionChange)="userDataChange('realname',$event)"
                placeholder="请输入真实姓名">
            </ion-input>
        </ion-item>

        <ion-item>
            <ion-icon slot="start" name="transgender-outline"></ion-icon>
            <ion-label position="stacked">性别</ion-label>
            <ion-input type="text" [value]="userData.gender" (ionChange)="userDataChange('gender',$event)"
                placeholder="请输入性别">
            </ion-input>
        </ion-item>

        <ion-item>
            <ion-icon slot="start" name="calendar-outline"></ion-icon>
            <ion-label position="stacked">年龄</ion-label>
            <ion-input type="number" [value]="userData.age" (ionChange)="userDataChange('age',$event)"
                placeholder="请输入年龄">
            </ion-input>
        </ion-item>

        <div class="button-group">
            <ion-button expand="block" (click)="save()">保存</ion-button>
            <ion-button expand="block" fill="outline" (click)="cancel()">取消</ion-button>
        </div>
    </ion-card-content>
</ion-card>