From 41bc28597ea94f70260359ec8bb065bf37338e68 Mon Sep 17 00:00:00 2001
From: Hsuan Lee <HsuanGM@gmail.com>
Date: Fri, 9 Aug 2019 12:16:26 +0800
Subject: [PATCH] feat(module:page-header): add default behavior for the back
 button (#3891)

close #3421
---
 components/page-header/doc/index.en-US.md      |  8 ++++----
 components/page-header/doc/index.zh-CN.md      |  2 +-
 .../page-header/nz-page-header.component.ts    | 10 ++++++++--
 components/page-header/nz-page-header.spec.ts  | 18 +++++++++++++++++-
 4 files changed, 30 insertions(+), 8 deletions(-)

diff --git a/components/page-header/doc/index.en-US.md b/components/page-header/doc/index.en-US.md
index 54598e3591d..d363fecc7c4 100644
--- a/components/page-header/doc/index.en-US.md
+++ b/components/page-header/doc/index.en-US.md
@@ -28,10 +28,10 @@ import { NzPageHeaderModule } from 'ng-zorro-antd/page-header';
 ### nz-page-header
 | Param | Description | Type | Default value |
 | ----- | ----------- | ---- | ------------- |
-| `[nzTitle]` | title string | `string \| TemplateRef<void>` | - |
-| `[nzSubtitle]` | subTitle string | `string \| TemplateRef<void>` | - |
-| `[nzBackIcon]` | custom back icon | `string \| TemplateRef<void>` | - |
-| `(nzBack)` | back icon click event | `EventEmitter<void>` | - |
+| `[nzTitle]` | Title string | `string \| TemplateRef<void>` | - |
+| `[nzSubtitle]` | SubTitle string | `string \| TemplateRef<void>` | - |
+| `[nzBackIcon]` | Custom back icon | `string \| TemplateRef<void>` | - |
+| `(nzBack)` | Back icon click event | `EventEmitter<void>` | Call [Location[back]](https://angular.io/api/common/Location#back) when the event not subscribed |
 
 ### Page header sections
 | Element | Description |
diff --git a/components/page-header/doc/index.zh-CN.md b/components/page-header/doc/index.zh-CN.md
index ad7dcd1b234..58c413058ad 100644
--- a/components/page-header/doc/index.zh-CN.md
+++ b/components/page-header/doc/index.zh-CN.md
@@ -32,7 +32,7 @@ import { NzPageHeaderModule } from 'ng-zorro-antd/page-header';
 | `[nzTitle]` | title 文字 | `string \| TemplateRef<void>` | - |
 | `[nzSubtitle]` | subTitle 文字 | `string \| TemplateRef<void>` | - |
 | `[nzBackIcon]` | 自定义 back icon | `string \| TemplateRef<void>` | - |
-| `(nzBack)` | 返回按钮的点击事件 | `EventEmitter<void>` | - |
+| `(nzBack)` | 返回按钮的点击事件 | `EventEmitter<void>` | 未订阅该事件时默认调用 [Location[back]](https://angular.cn/api/common/Location#back) |
 
 ### Page header 组成部分
 | 元素 | 说明 |
diff --git a/components/page-header/nz-page-header.component.ts b/components/page-header/nz-page-header.component.ts
index ed7150df0ea..13552b464e7 100644
--- a/components/page-header/nz-page-header.component.ts
+++ b/components/page-header/nz-page-header.component.ts
@@ -20,6 +20,8 @@ import {
   TemplateRef,
   ViewEncapsulation
 } from '@angular/core';
+
+import { Location } from '@angular/common';
 import { NzPageHeaderFooterDirective } from './nz-page-header-cells';
 
 @Component({
@@ -58,7 +60,7 @@ export class NzPageHeaderComponent implements OnInit, OnChanges {
     NzPageHeaderFooterDirective
   >;
 
-  constructor() {}
+  constructor(private location: Location) {}
 
   ngOnInit(): void {}
 
@@ -70,6 +72,10 @@ export class NzPageHeaderComponent implements OnInit, OnChanges {
   }
 
   onBack(): void {
-    this.nzBack.emit();
+    if (this.nzBack.observers.length) {
+      this.nzBack.emit();
+    } else {
+      this.location.back();
+    }
   }
 }
diff --git a/components/page-header/nz-page-header.spec.ts b/components/page-header/nz-page-header.spec.ts
index afb42bfd8e0..9c7d1f50e50 100644
--- a/components/page-header/nz-page-header.spec.ts
+++ b/components/page-header/nz-page-header.spec.ts
@@ -1,6 +1,8 @@
+import { Location } from '@angular/common';
 import { NO_ERRORS_SCHEMA } from '@angular/core';
 import { async, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
+import { RouterTestingModule } from '@angular/router/testing';
 import { NzIconTestModule } from 'ng-zorro-antd/icon/testing';
 import { NzDemoPageHeaderActionsComponent } from './demo/actions';
 import { NzDemoPageHeaderBasicComponent } from './demo/basic';
@@ -11,9 +13,10 @@ import { NzPageHeaderComponent } from './nz-page-header.component';
 import { NzPageHeaderModule } from './nz-page-header.module';
 
 describe('NzPageHeaderComponent', () => {
+  let location: Location;
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      imports: [NzPageHeaderModule, NzIconTestModule],
+      imports: [NzPageHeaderModule, NzIconTestModule, RouterTestingModule],
       schemas: [NO_ERRORS_SCHEMA],
       declarations: [
         NzDemoPageHeaderBasicComponent,
@@ -22,6 +25,7 @@ describe('NzPageHeaderComponent', () => {
         NzDemoPageHeaderActionsComponent
       ]
     }).compileComponents();
+    location = TestBed.get(Location);
   }));
 
   it('should basic work', () => {
@@ -40,6 +44,18 @@ describe('NzPageHeaderComponent', () => {
     expect(pageHeader.nativeElement.querySelector('nz-breadcrumb[nz-page-header-breadcrumb]')).toBeTruthy();
   });
 
+  it('should default call location back when nzBack not has observers', () => {
+    const fixture = TestBed.createComponent(NzDemoPageHeaderBreadcrumbComponent);
+    const pageHeader = fixture.debugElement.query(By.directive(NzPageHeaderComponent));
+    spyOn(location, 'back');
+    fixture.detectChanges();
+    expect(location.back).not.toHaveBeenCalled();
+    const back = pageHeader.nativeElement.querySelector('.ant-page-header-back');
+    (back as HTMLElement).click();
+    fixture.detectChanges();
+    expect(location.back).toHaveBeenCalled();
+  });
+
   it('should content work', () => {
     const fixture = TestBed.createComponent(NzDemoPageHeaderContentComponent);
     const pageHeader = fixture.debugElement.query(By.directive(NzPageHeaderComponent));