From e63668da040f284d711147b0829a1caa32d57ead Mon Sep 17 00:00:00 2001 From: VTHINKXIE Date: Wed, 11 Apr 2018 12:48:01 +0800 Subject: [PATCH] fix(module:menu): fix menu ExpressionChangedAfterItHasBeenCheckedError (#1306) close #1216 --- components/menu/nz-menu-item.directive.ts | 22 +++++++++------------- components/menu/nz-menu.directive.ts | 6 ------ components/menu/nz-submenu.component.ts | 3 +-- 3 files changed, 10 insertions(+), 21 deletions(-) diff --git a/components/menu/nz-menu-item.directive.ts b/components/menu/nz-menu-item.directive.ts index dbdcaef6a17..d66d6e34b48 100644 --- a/components/menu/nz-menu-item.directive.ts +++ b/components/menu/nz-menu-item.directive.ts @@ -89,32 +89,28 @@ export class NzMenuItemDirective implements OnInit { @HostBinding('style.padding-left.px') get setPaddingLeft(): number { - if (this.nzSubMenuComponent) { - /** if in sub menu component */ - if (this.nzSubMenuComponent.nzMenuDirective.nzMode === 'inline' && (this.nzSubMenuComponent.nzMenuDirective)) { - /** if host menu's mode is inline add PADDING_BASE * level padding */ - return (this.nzSubMenuComponent.level + 1) * this.nzSubMenuComponent.nzMenuDirective.nzInlineIndent; + if (this.nzMenuDirective.nzMode === 'inline') { + if (this.nzSubMenuComponent) { + /** if in sub menu component and host menu's mode is inline add PADDING_BASE * level padding */ + return (this.nzSubMenuComponent.level + 1) * this.nzMenuDirective.nzInlineIndent; } else { - /** return origin padding */ - return this.padding; + /** not in sub menu component but root menu's mode is inline return default padding */ + return this.nzMenuDirective.nzInlineIndent; } - } else if (this.nzMenuDirective.hasSubMenu && (this.nzMenuDirective.nzMode === 'inline')) { - /** not in sub menu component but root menu's mode is inline and contains submenu return default padding*/ - return this.nzMenuDirective.nzInlineIndent; } else { return this.padding; } } constructor(private renderer: Renderer2, public cd: ChangeDetectorRef, private nzMenuDirective: NzMenuDirective, @Optional() public nzSubMenuComponent: NzSubMenuComponent, private hostElement: ElementRef) { + } + + ngOnInit(): void { this.nzMenuDirective.menuItems.push(this); /** store origin padding in padding */ if (this.hostElement.nativeElement.style[ 'padding-left' ]) { this.padding = parseInt(this.hostElement.nativeElement.style[ 'padding-left' ], 10); } - } - - ngOnInit(): void { this.isInDropDown = this.nzMenuDirective.nzInDropDown; } } diff --git a/components/menu/nz-menu.directive.ts b/components/menu/nz-menu.directive.ts index 5aa3e85de8b..9f37caab370 100644 --- a/components/menu/nz-menu.directive.ts +++ b/components/menu/nz-menu.directive.ts @@ -29,8 +29,6 @@ export class NzMenuDirective implements AfterViewInit { private cacheMode: NzMode; /** opened index of array */ private subMenusOpenIndex = []; - /** set when has submenu component */ - hasSubMenu = false; /** collection of menu item */ menuItems: NzMenuItemDirective[] = []; @@ -168,10 +166,6 @@ export class NzMenuDirective implements AfterViewInit { this.subMenusOpenIndex = []; } - setHasSubMenu(value: boolean): void { - this.hasSubMenu = value; - } - clickItem(value: NzMenuItemDirective): void { this.nzClick.emit(value); } diff --git a/components/menu/nz-submenu.component.ts b/components/menu/nz-submenu.component.ts index b4f0d13b7e8..bff5396ebfc 100644 --- a/components/menu/nz-submenu.component.ts +++ b/components/menu/nz-submenu.component.ts @@ -359,11 +359,10 @@ export class NzSubMenuComponent implements OnInit, OnDestroy, AfterContentInit { } constructor(public nzMenuDirective: NzMenuDirective, private cd: ChangeDetectorRef, @SkipSelf() @Optional() private nzSubMenuComponent: NzSubMenuComponent, @Host() @Optional() private nzDropDownComponent: NzDropDownComponent, @Host() @Optional() private nzDropDownButtonComponent: NzDropDownButtonComponent) { - this.nzMenuDirective.setHasSubMenu(true); - this.nzMenuDirective.subMenus.push(this); } ngOnInit(): void { + this.nzMenuDirective.subMenus.push(this); const $combineAll = this.$mouseSubject.asObservable().pipe(combineLatest(this.$subOpen), map(value => value[ 0 ] || value[ 1 ]), auditTime(150)); this.openSubscription = $combineAll.subscribe(this.handleOpenEvent); this.isInDropDown = this.nzMenuDirective.nzInDropDown;