fix(module:page-header): has footer or breadcrumb style bug (#4363)

* fix(module:page-header): has footer or breadcrumb style bug * fix(module:page-header): add test
NG-ZORRO · Nov 7, 2019 · dcc7deb · dcc7deb
1 parent cc3868e
commit dcc7deb
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/components/page-header/nz-page-header.component.ts b/components/page-header/nz-page-header.component.ts
@@ -21,7 +21,7 @@ import {
 } from '@angular/core';
 
 import { Location } from '@angular/common';
-import { NzPageHeaderFooterDirective } from './nz-page-header-cells';
+import { NzPageHeaderBreadcrumbDirective, NzPageHeaderFooterDirective } from './nz-page-header-cells';
 
 @Component({
   selector: 'nz-page-header',
@@ -32,7 +32,8 @@ import { NzPageHeaderFooterDirective } from './nz-page-header-cells';
   encapsulation: ViewEncapsulation.None,
   host: {
     class: 'ant-page-header ant-page-header-ghost',
-    '[class.ant-page-header-has-footer]': 'nzPageHeaderFooter'
+    '[class.has-footer]': 'nzPageHeaderFooter',
+    '[class.has-breadcrumb]': 'nzPageHeaderBreadcrumb'
   },
   styles: [
     `
@@ -59,6 +60,10 @@ export class NzPageHeaderComponent implements OnChanges {
     NzPageHeaderFooterDirective
   >;
 
+  @ContentChild(NzPageHeaderBreadcrumbDirective, { static: false }) nzPageHeaderBreadcrumb: ElementRef<
+    NzPageHeaderBreadcrumbDirective
+  >;
+
   constructor(private location: Location) {}
 
   ngOnChanges(changes: SimpleChanges): void {

diff --git a/components/page-header/nz-page-header.spec.ts b/components/page-header/nz-page-header.spec.ts
@@ -44,6 +44,7 @@ describe('NzPageHeaderComponent', () => {
     const fixture = TestBed.createComponent(NzDemoPageHeaderBreadcrumbComponent);
     const pageHeader = fixture.debugElement.query(By.directive(NzPageHeaderComponent));
     fixture.detectChanges();
+    expect(pageHeader.nativeElement.classList).toContain('has-breadcrumb');
     expect(pageHeader.nativeElement.querySelector('nz-breadcrumb[nz-page-header-breadcrumb]')).toBeTruthy();
   });
 
@@ -80,7 +81,7 @@ describe('NzPageHeaderComponent', () => {
     const fixture = TestBed.createComponent(NzDemoPageHeaderResponsiveComponent);
     const pageHeader = fixture.debugElement.query(By.directive(NzPageHeaderComponent));
     fixture.detectChanges();
-    expect(pageHeader.nativeElement.classList).toContain('ant-page-header-has-footer');
+    expect(pageHeader.nativeElement.classList).toContain('has-footer');
     expect(pageHeader.nativeElement.querySelector('nz-page-header-footer.ant-page-header-footer')).toBeTruthy();
   });