From cc8d2509b58fb39ec3f1f40c5bc57d997ef937dc Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=89=A7=E8=A1=A1?= <yadong.xyd@alibaba-inc.com>
Date: Fri, 18 Aug 2017 11:46:19 +0800
Subject: [PATCH] fix(module:menu): fix submenu level bug & fix menu
 routerLinkActive bug in lazyload module this closes #35 #52 #74

---
 src/components/menu/nz-menu-item.component.ts | 28 +++++++++++++------
 src/components/menu/nz-submenu.component.ts   |  4 +--
 .../nz-demo-layout-side.component.ts          |  2 +-
 3 files changed, 22 insertions(+), 12 deletions(-)

diff --git a/src/components/menu/nz-menu-item.component.ts b/src/components/menu/nz-menu-item.component.ts
index 64b43111981..6e9b3e29456 100644
--- a/src/components/menu/nz-menu-item.component.ts
+++ b/src/components/menu/nz-menu-item.component.ts
@@ -5,6 +5,7 @@ import {
   AfterViewInit,
   HostListener,
   ChangeDetectorRef,
+  Renderer2,
   Optional,
   ElementRef
 } from '@angular/core';
@@ -14,8 +15,8 @@ import { NzSubMenuComponent } from './nz-submenu.component';
 export const PADDING_BASE = 24;
 
 @Component({
-  selector     : '[nz-menu-item]',
-  template     : `
+  selector: '[nz-menu-item]',
+  template: `
     <ng-content></ng-content>`,
 })
 
@@ -23,8 +24,22 @@ export class NzMenuItemComponent implements AfterViewInit {
   level = 0;
   padding = null;
   isInDropDown = false;
+  selected = false;
   @Input() nzDisable = false;
-  @Input() nzSelected = false;
+
+  @Input()
+  set nzSelected(value: boolean) {
+    this.selected = value;
+    if (value) {
+      this._renderer.addClass(this.hostElement.nativeElement, 'ant-menu-item-selected')
+    } else {
+      this._renderer.removeClass(this.hostElement.nativeElement, 'ant-menu-item-selected')
+    }
+  }
+
+  get nzSelected() {
+    return this.selected;
+  }
 
   /** clear all item selected status except this */
   @HostListener('click', [ '$event' ])
@@ -51,11 +66,6 @@ export class NzMenuItemComponent implements AfterViewInit {
     return this.isInDropDown && this.nzDisable;
   }
 
-  @HostBinding('class.ant-menu-item-selected')
-  get setMenuSelectedClass() {
-    return this.nzSelected;
-  }
-
   @HostBinding('class.ant-menu-item-disabled')
   get setMenuDisableClass() {
     return (!this.isInDropDown) && this.nzDisable;
@@ -80,7 +90,7 @@ export class NzMenuItemComponent implements AfterViewInit {
     }
   }
 
-  constructor(public cd: ChangeDetectorRef, private nzMenuComponent: NzMenuComponent, @Optional() public nzSubMenuComponent: NzSubMenuComponent, private hostElement: ElementRef) {
+  constructor(private _renderer: Renderer2, public cd: ChangeDetectorRef, private nzMenuComponent: NzMenuComponent, @Optional() public nzSubMenuComponent: NzSubMenuComponent, private hostElement: ElementRef) {
     this.nzMenuComponent.menuItems.push(this);
     /** store origin padding in padding */
     if (this.hostElement.nativeElement.style[ 'padding-left' ]) {
diff --git a/src/components/menu/nz-submenu.component.ts b/src/components/menu/nz-submenu.component.ts
index 71c53091741..69d51c3f030 100644
--- a/src/components/menu/nz-submenu.component.ts
+++ b/src/components/menu/nz-submenu.component.ts
@@ -50,7 +50,7 @@ import { Subject } from 'rxjs/Rx';
 
 export class NzSubMenuComponent implements OnInit, OnDestroy, AfterViewInit {
   isInDropDown = false;
-  level = 0;
+  level = 1;
   _$mouseSubject = new Subject();
   @ContentChildren(NzSubMenuComponent) subMenus;
   @Input() nzOpen = false;
@@ -135,7 +135,7 @@ export class NzSubMenuComponent implements OnInit, OnDestroy, AfterViewInit {
   ngAfterViewInit() {
     this.isInDropDown = this.nzMenuComponent.isInDropDown;
     if (this.subMenus.length && (this.nzMenuComponent.nzMode === 'inline')) {
-      this.subMenus.forEach(menu => {
+      this.subMenus.filter(x => x !== this).forEach(menu => {
         setTimeout(_ => {
           menu.level = this.level + 1;
         });
diff --git a/src/showcase/nz-demo-layout/nz-demo-layout-side.component.ts b/src/showcase/nz-demo-layout/nz-demo-layout-side.component.ts
index a162e4c25ce..4fcb65b6b73 100644
--- a/src/showcase/nz-demo-layout/nz-demo-layout-side.component.ts
+++ b/src/showcase/nz-demo-layout/nz-demo-layout-side.component.ts
@@ -65,7 +65,7 @@ import { Component, OnInit } from '@angular/core';
   ]
 })
 export class NzDemoLayoutSideComponent implements OnInit {
-  isCollapsed = false;
+  isCollapsed = true;
 
   constructor() {
   }