左侧菜单栏实现

HTML页面展示代码：

<div id="side-left">
  <div class="side-left">
    <h1 class="caption">左侧菜单栏标题</h1>
    <ul class="list">
      <li class="item" ng-repeat="item in menue" ng-class="{selected:choosenEn == item.id}">
        <a ng-click="goUrlLeft(item)">
          <span class="title" ng-bind="item.name"></span>
          <span class="info" ng-bind="item.info"></span>
        </a>
      </li>
    </ul>
  </div>
</div>


controller.js代码：

function ($scope, $element, EgI18nUtil,$attrs ,$rootScope, UserUtil) {
   $scope.i18nMap = EgI18nUtil.getI18nMap();

   //查询菜单
   UserUtil.queryMenu($scope.request, function (data) {
       $rootScope.$safeApply($scope, function () {
            var menue = data.sMQueryMenuAndLang;
            var newMenue = [];
            if (menue.length > 0) {
              angular.forEach(menue, function (item) {
                if (item.parentId == null) {
                  newMenue.push(item);
                }
              });
            } else {
              angular.noop();
            }
            $scope.menue = newMenue;
            $scope.choosenEn = $scope.menue[0].id;
            $scope.goUrlLeft = function(item) {
              $scope.choosenEn = item.id;
              window.location.href = item.href;
            }
          });
        }, function () {
          $rootScope.$safeApply($scope, function () {
            $scope.menue = [];
          });
        });
      }

转载于:https://www.cnblogs.com/caroline-z/p/5937471.html