Angular 4 : Mega menu is not closed after clicked on a menu inside it

问题

I am working in an angular 4 project ,In this I have a mega menu .What I want to do is when I clicked on a menu inside the mega menu I want to close it .

In my case it always open even after I clicked on a specific menu ,but closed if I remove the mouse focus in it .

Stackblitz : https://stackblitz.com/edit/angular-bootstrap-carousel-dynamic2-w1qhj4?file=app/app.component.html

can anyone help me to fix it .

回答1:

Your application contains error(Check Inspector tools console for details). Try adding following function implementation in your app.component.js, the code will work fine. https://angular-bootstrap-carousel-dynamic2-imxxrv.stackblitz.io

getStoreData() {
    // do something
  }
  categoryClick () {
    alert('Inside category');
  }
  groupClick() {
    alert('Inside Group');
  }

  subGroupClick() {
    alert('Inside Sub Group');
  }

回答2:

This Works

ngOnInit() {
    this.CartdataService.get_New_Products().subscribe(
      data => {
        this.storeData = data;
          console.log(this.storeData);        
      });
  }

  categoryClick(event:Event, data,data2){
    alert(data2)
  }

  groupClick(event:Event, data,data2,data3, data4){
    //event.stopPropagation();
    //event.preventDefault();
  }

  subGroupClick(event:Event, data,data2,data3, data4, data5, data6){
    //event.stopPropagation();
    //event.preventDefault();
  }
}

来源：https://stackoverflow.com/questions/51552712/angular-4-mega-menu-is-not-closed-after-clicked-on-a-menu-inside-it