Error with AngularJs

[CesarD]

I have an AngularJs application and I’m using SmartMenus with the Bootstrap addon to show the navigation bar.

I implemented the same code as in the Bootstrap-navbar-fixed-top example, but I’m using the directive ng-if to show the div containing the menues. I had to use an angular directive to trigger the $.SmartMenus.Bootstrap.init() call because of this and everything works great until the app removes the container div because of login mechanism. Once this happens, if I click anywhere in the page, an error is thrown from function hideMenu on this instruction: $sub.dataSM('parent-a').removeClass('highlighted').attr('aria-expanded', 'false'); because dataSM() returns null.

Maybe the SmartMenus plugin keeps stuff in memory that keeps triggering despite the removal of the DOM elements?

Any help will be appreciated. thanks.

[admin]

I will need a live demo to investigate it in details but I guess it may not be very simple to avoid the issue. I guess your ng-if removes the menu from the DOM when there are some activated sub menus and when the SmartMenus script tries to reset them, similar errors might be produces since the elements are no longer in the DOM.

Isn’t it an option for you to show/hide the menu tree with an ng-show/ng-hide instead? I guess it would work fine if you use any of them instead of ng-if.

[CesarD]

Yeah, I tried with ng-show/hide but Bootstrap has some display styles for navbar classes marked as !important, which prevents ng-show/hide to work correctly in this case (at least without messing around with the Bootstrap css classes).

I temporarily fixed the problem by replacing the line I mentioned with this:

var parent = $sub.dataSM('parent-a');
if (parent)
	parent.removeClass('highlighted').attr('aria-expanded', 'false');

I don’t know if it’s the most elegant fix, but it gets the job done and no further errors raised after this.

My concern is if any stuff in memory would get reset the next time $.SmartMenus.Bootstrap.init() is called… Because I wonder if there would be SmartMenus objects piling up in memory every time my users log off and log back in without reloading the app…

[schappaughc]

I am having the same issue as described above. Is there a solution or update available?

[schappaughc]

I found help here. https://github.com/vadikom/smartmenus/issues/16
(wasn’t using button groups but was using columns inside bootstrap dropdown menus for some items)
so added “data-in-mega_smartmenus=”true”” as shown below

  <ul class="dropdown-menu">
    <li>
      <ul class="list-unstyled col-sm-6 nav-border" data-in-mega_smartmenus="true">
          <li><a>Great Plains IDEA Directory</a></li>
          <li><a>Lead Institution</a></li>
          <li><a>Functional Teams</a></li>
          <li><a>Human Sciences</a></li>
          <li><a>Board of Directors</a></li>
          <li><a>Campus Coordinators</a></li>
          <li><a>Program Contacts</a></li>
      </ul>
      <ul class="list-unstyled col-sm-6" data-in-mega_smartmenus="true">
           <li><a>AG IDEA</a></li>
          <li><a>Executive Committee</a></li>
          <li><a>Campus Coordinators</a></li>
          <li><a>Program Contacts</a></li>
      </ul>
    </li>
  </ul>

[Author]

Posts