How to slide to the top of the page in ionic 3 - ionic-framework

Question

I am developing a SIgnup page in ionic 3 and the no of fields are 10.
SO I am using a p tag to show validation and when the user hits submit I want to take him all the way up to the start of the page which has my header and all.How can I achieve this?I have tried everything.
Below is my code:
<ion-content padding class="label-cl green-bg acct-sct item-row" style="position:fixed">
<h2 class="center-col">Create An Account</h2>
<form #f="ngForm" (ngSubmit)="signUp(f)">
<ion-item>
<ion-label floating>Username</ion-label>
<ion-input type="text" name="name" ngModel required></ion-input>
</ion-item>
<p style="color:red;text-align: left" *ngIf="usernameError">Invalid Username</p>
<ion-item>
<ion-label floating>Email</ion-label>
<ion-input type="email" name="email" ngModel required></ion-input>
</ion-item>
<p style="color:red;text-align: left" *ngIf="emailError">Invalid E-mail</p>
<ion-item>
<ion-label floating>Password</ion-label>
<ion-input type="Password" name="password" ngModel required></ion-input>
</ion-item>
<p style="color:red;text-align: left" *ngIf="passwordLengthError">Invalid Password</p>
<ion-item>
<ion-label floating>Confirm Password</ion-label>
<ion-input type="Password" name="confirm_password" ngModel required></ion-input>
</ion-item>
<div class="button-inline">
<button ion-button class="yellow-cl" [disabled]="!f.valid">Submit</button>
</div>
</form>
</ion-content>
It has more fields but I am showing only these just for the sake of clarity.
Thanks in advance.

Answer 1

Add the below code to your .ts file
import { Component, ViewChild } from '#angular/core';
import { Content } from 'ionic-angular';
#Component({...})
export class SignUpPage{
#ViewChild(Content) content: Content;
signUp() {
this.content.scrollToTop();
}
}
We used Angular's #ViewChild annotation to get a reference to the ionic content component which has the method scrollToTop().
Find more details in the Official docs