diff --git a/npm/ng-packs/apps/dev-app/src/app/home/home.component.html b/npm/ng-packs/apps/dev-app/src/app/home/home.component.html
index 2733150b71..ae3196c0c6 100644
--- a/npm/ng-packs/apps/dev-app/src/app/home/home.component.html
+++ b/npm/ng-packs/apps/dev-app/src/app/home/home.component.html
@@ -8,12 +8,7 @@
     </div>
   </div>
   <a href="https://abp.io?ref=tmpl" target="_blank" class="btn btn-primary px-4">abp.io</a>
-  <a
-    *ngIf="!hasLoggedIn"
-    routerLink="/account/login"
-    [state]="{ redirectUrl: '/' }"
-    class="px-4 btn btn-primary ml-1"
-    role="button"
+  <a *ngIf="!hasLoggedIn" (click)="login()" class="px-4 btn btn-primary ml-1" role="button"
     ><i class="fa fa-sign-in"></i> {{ 'AbpIdentity::Login' | abpLocalization }}</a
   >
 </div>
diff --git a/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts b/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts
index a42b960493..9daacbabaf 100644
--- a/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts
+++ b/npm/ng-packs/apps/dev-app/src/app/home/home.component.ts
@@ -11,4 +11,8 @@ export class HomeComponent {
   }
 
   constructor(private oAuthService: OAuthService) {}
+
+  login() {
+    this.oAuthService.initCodeFlow();
+  }
 }
diff --git a/templates/app/angular/src/app/home/home.component.html b/templates/app/angular/src/app/home/home.component.html
index f4d41daf4f..fc7a0a4183 100644
--- a/templates/app/angular/src/app/home/home.component.html
+++ b/templates/app/angular/src/app/home/home.component.html
@@ -8,13 +8,7 @@
     </div>
   </div>
   <a href="https://abp.io?ref=tmpl" target="_blank" class="btn btn-primary px-4">abp.io</a>
-  <a
-    *ngIf="!hasLoggedIn"
-    routerLink="/account/login"
-    [state]="{ redirectUrl: '/' }"
-    class="px-4 btn btn-primary ml-1"
-    role="button"
-    id="login-button"
+  <a *ngIf="!hasLoggedIn" (click)="login()" class="px-4 btn btn-primary ml-1" role="button"
     ><i class="fa fa-sign-in"></i> {{ 'AbpAccount::Login' | abpLocalization }}</a
   >
 </div>
diff --git a/templates/app/angular/src/app/home/home.component.ts b/templates/app/angular/src/app/home/home.component.ts
index a42b960493..9daacbabaf 100644
--- a/templates/app/angular/src/app/home/home.component.ts
+++ b/templates/app/angular/src/app/home/home.component.ts
@@ -11,4 +11,8 @@ export class HomeComponent {
   }
 
   constructor(private oAuthService: OAuthService) {}
+
+  login() {
+    this.oAuthService.initCodeFlow();
+  }
 }