<!-- IonicModule + FormsModule实现，默认好看 -->
<div class="login-modal">
    <ion-card>
        <ion-card-header>
            <ion-card-title>登录</ion-card-title>
            <ion-card-subtitle>该页面需登陆可继续使用</ion-card-subtitle>
        </ion-card-header>

        <ion-card-content>
            <ion-input [(ngModel)]="userData.username" label="账号/手机" labelPlacement="floating" [counter]="true"
                maxlength="20">
            </ion-input>

            <ion-input [(ngModel)]="userData.password" label="密码" labelPlacement="floating" [counter]="true"
                maxlength="20"></ion-input>

        </ion-card-content>

        <ion-button expand="block" (click)="login()">登录</ion-button>
        <ion-button expand="block" fill="clear" (click)="goBack()">返回</ion-button>
    </ion-card>
</div>


<!-- 纯HTML + FormsModule实现，可任意定制样式 -->
<ng-container *ngIf="false">

    请输入用户名：{{userData.username}} <br />

    <input [(ngModel)]="userData.username" type="text" /><br />

    请输入密码：{{userData.password}}<br />
    <input [(ngModel)]="userData.password" type="password" /><br />

    <button (click)="login()">登录</button>

</ng-container>