fix(module:menu): fix menu title ExpressionChangedAfterItHasBeenCheck…

…edError close NG-ZORRO#3023
hsuanxyz · Jun 21, 2019 · 98430b6 · 98430b6
1 parent 940c536
commit 98430b6
Show file tree

Hide file tree

Showing 2 changed files with 32 additions and 3 deletions.
diff --git a/components/menu/nz-menu.spec.ts b/components/menu/nz-menu.spec.ts
@@ -44,7 +44,8 @@ describe('menu', () => {
         NzDemoMenuSwitchModeComponent,
         NzTestMenuHorizontalComponent,
         NzTestMenuInlineComponent,
-        NzDemoMenuNgForComponent
+        NzDemoMenuNgForComponent,
+        NzTestNgIfMenuComponent
       ],
       schemas: [NO_ERRORS_SCHEMA],
       providers: [
@@ -477,7 +478,16 @@ describe('menu', () => {
     });
     describe('ng-for', () => {
       it('should ng for works fine', () => {
-        TestBed.createComponent(NzDemoMenuNgForComponent).detectChanges();
+        expect(() => {
+          TestBed.createComponent(NzDemoMenuNgForComponent).detectChanges();
+        }).not.toThrowError();
+      });
+    });
+    describe('ng-if', () => {
+      it('should ng if works fine', () => {
+        expect(() => {
+          TestBed.createComponent(NzTestNgIfMenuComponent).detectChanges();
+        }).not.toThrowError();
       });
     });
   });
@@ -684,3 +694,21 @@ export class NzTestBasicMenuHorizontalComponent {}
   `
 })
 export class NzTestBasicMenuInlineComponent {}
+
+// https://github.com/NG-ZORRO/ng-zorro-antd/issues/3023
+@Component({
+  template: `
+    <ul nz-menu nzMode="horizontal">
+      <li *ngIf="display" nz-submenu>
+        <span title>{{ text }}</span>
+        <ul>
+          <li nz-menu-item>item</li>
+        </ul>
+      </li>
+    </ul>
+  `
+})
+export class NzTestNgIfMenuComponent {
+  text = 'text';
+  display = true;
+}
diff --git a/components/menu/nz-submenu.component.ts b/components/menu/nz-submenu.component.ts
@@ -168,11 +168,11 @@ export class NzSubMenuComponent implements OnInit, OnDestroy, AfterContentInit,
         this.overlayPositions =
           mode === 'horizontal' ? [POSITION_MAP.bottomLeft] : [POSITION_MAP.rightTop, POSITION_MAP.leftTop];
         if (open !== this.nzOpen) {
+          this.setTriggerWidth();
           this.nzOpen = open;
           this.nzOpenChange.emit(this.nzOpen);
         }
         this.setClassMap();
-        this.setTriggerWidth();
       });
     this.nzSubmenuService.menuOpen$.pipe(takeUntil(this.destroy$)).subscribe((data: boolean) => {
       this.nzMenuService.menuOpen$.next(data);
@@ -210,6 +210,7 @@ export class NzSubMenuComponent implements OnInit, OnDestroy, AfterContentInit,
   ngOnChanges(changes: SimpleChanges): void {
     if (changes.nzOpen) {
       this.nzSubmenuService.setOpenState(this.nzOpen);
+      this.setTriggerWidth();
     }
     if (changes.nzDisabled) {
       this.nzSubmenuService.disabled = this.nzDisabled;