带有materializecss的动态菜单

时间:2016-05-04 17:13:05

标签: javascript jquery css html5 materialize

我有一个关于我想要动态的菜单和子菜单的问题。 我有以下html

<li ng-repeat="item in menus" class="{{item.Submenu.length ? 'dropdown-button' : ''}}" 
           data-activates="{{item.Submenu.length ? 'Administracion' : ''}}">
    <span ng-bind-html="item.Nombre"></span>
    <ul ng-if="item.Submenu.length>0" id="Administracion" class="dropdown-content">
      <li ng-repeat="subItem in item.Submenu" ng-init="$last && rebindDropDowns()">
        <a ng-href="{{subItem.Nombre}}" ng-bind-html="subItem.Opcion">{{subItem.Opcion}}</a>
      </li>
    </ul>
    <ul ng-if="item.Submenu.length>0" id="Solicitud" class="dropdown-content">
      <li ng-repeat="subItem in item.Submenu" ng-init="$last && rebindDropDowns()">
        <a ng-href="{{subItem.Nombre}}" ng-bind-html="subItem.Opcion">{{subItem.Opcion}}</a>
      </li>
    </ul>
</li>

我有2个子菜单​​(&#34; Administracion&#34;,&#34; Solicitudes&#34;),但只设法显示给#34; Administracion&#34;,&#34; Solicitudes&#34; ;它向我展示了&#34;管理&#34;的相同子菜单。

那是因为我有这条线

data-activates="{{item.Submenu.length ? 'Administracion' : ''}}"

但是如果我这样做会给我错误

data-activates="{{item.Submenu.length ? {{item.Opcion}} : ''}}"

选项可以是&#34; Administracion&#34; o&#34; Solicitudes&#34;

你知道如何解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

显然我工作了,我现在没有&#34; {{}}&#34;并正常运作。

<li ng-repeat="item in menus" class="{{item.Submenu.length ? 'dropdown-button' : ''}}"
          data-activates="{{item.Submenu.length ? item.Opcion : ''}}">
        <span ng-bind-html="item.Nombre"></span>
        <ul ng-if="item.Submenu.length>0" id="Administracion" class="dropdown-content">
          <li ng-repeat="subItem in item.Submenu" ng-init="$last && rebindDropDowns()"><a ng-href="{{subItem.Nombre}}" ng-bind-html="subItem.Opcion">{{subItem.Opcion}}</a></li>
        </ul>
        <ul ng-if="item.Submenu.length>0" id="Solicitud" class="dropdown-content">
          <li ng-repeat="subItem in item.Submenu" ng-init="$last && rebindDropDowns()"><a ng-href="{{subItem.Nombre}}" ng-bind-html="subItem.Opcion">{{subItem.Opcion}}</a></li>
        </ul>
      </li>

如果有人帮助我离开我希望如此。