Angular JS 1.5中的页面冻结?

时间:2017-04-15 09:51:17

标签: angularjs asp.net-mvc-4 razor

我无法弄清楚我的代码中发生了什么,所以这就是我想在论坛上发布我的问题的原因。

我正在尝试使用AngularJS 1.5在我的Asp.Net MVC 5.0应用程序中实现动态菜单,但是当我导航到其他菜单时页面冻结,所以你们可以帮助我,为什么我的页面会冻结。< / p>

抱歉无法弄清楚究竟是什么问题所以任何人都会指出我......

填充菜单的代码“ _Layout.cshml

<header>
<nav ng-init="fillMenuController()" ng-controller="LayoutCtrl" class="navbar-inverse">
<div class="container-fluid">
    <div class="navbar-header"></div>
    <script type="text/ng-template" id="treeMenu">
        <a class="dropdown-toggle" href="{{menu.URL}}" ng-attr-data-toggle="{{menu.URL == '#'?'dropdown':''}}">
            {{menu.LinkText}}
            <span ng-if="(MenuList | filter:{ParentCategoryID : menu.ID}).length > 0">
                <span class="caret"></span>
                <ul ng-hide="(MenuList | filter:{ParentCategoryID : menu.ID}).length == 0" class="dropdown-menu">
                    <li ng-repeat="x in MenuList | filter: {ParentCategoryID : menu.ID}">
                        <a href="{{x.URL}}">{{x.LinkText}}</a>
                    </li>
                </ul>
            </span>
        </a>
    </script>

    <div class="navbar-header"><a href="#"><img class="img-responsive AngularJS-small" src="~/Images/ACE.jpg" style="height: 40px; padding-top: 10px;" /></a></div>
    <ul class="nav navbar-nav">
        <li class="dropdown" ng-repeat="menu in MenuList | filter: {ParentCategoryID : 0}" ng-include="'treeMenu'" />
        <li id="btnLogOut"><a href="#">Log out</a></li>
    </ul>
</div>

控制器代码

app.controller("LayoutCtrl", function ($scope, LayoutService, common) {

    $scope.MenuList = [];

    $scope.fillMenuController = function () {
        var MenuMasterData = LayoutService.GetMenuMaster()
        MenuMasterData.then(function (response) {
            if (response.data.length == 0) { return; }
            $scope.MenuList = response.data;

        }, function (response) {
            if (response.data != null)
            {
                common.ShowMessage(response.data);
            }
        });
    }
});

app.service("LayoutService", function ($http) {

    this.GetMenuMaster = function () {
        var response = $http({
            method: 'get',
            url: "/Layout/GetMenuMaster",
            params: {},
            cache: true
        })
        return response;
    };
});

填充动态菜单的数据库代码

 public JsonResult GetMenuMaster()
        {
            SAPDataContext objSAPDataContext = new SAPDataContext();

            try
            {
                List<BE_Menu> lstMenu = new List<BE_Menu>
            {
                new BE_Menu { ID = 1, LinkText = "Activity", URL="/CRM/Activity/", ParentCategoryID = 0 },
                new BE_Menu { ID = 2, LinkText = "Business Partners", URL="/CRM/BusinessPartner/", ParentCategoryID = 0   },
                new BE_Menu { ID = 3, LinkText = "Sales", URL="#", ParentCategoryID = 0   },
                new BE_Menu { ID = 4, LinkText = "Sales Opportunities", URL="/Opportunity/OpportunityMaster", ParentCategoryID = 3   },
                new BE_Menu { ID = 5, LinkText = "Sales Quotation", URL="/CRM/SalesQuotation/", ParentCategoryID = 3  },
                new BE_Menu { ID = 6, LinkText = "Sales Order", URL="/CRM/SalesOrder/", ParentCategoryID = 3   },
                new BE_Menu { ID = 7, LinkText = "Delivery", URL="/CRM/Delivery/", ParentCategoryID = 0   },
                new BE_Menu { ID = 8, LinkText = "Service Call", URL="/CRM/ServiceCall/", ParentCategoryID = 0   },
                new BE_Menu { ID = 9, LinkText = "Customer Equipment Card", URL="/CRM/EquipmentCard/", ParentCategoryID = 0   }
            };

                return Json(lstMenu, JsonRequestBehavior.AllowGet);
            }
            catch (Exception ex)
            {
                throw ex;
            }
            finally
            {
                objSAPDataContext.Dispose();
            }
        }

现在我的一些输入现在我偶然发现了这个错误:第{133}栏第345行的未处理异常

0x800a139e - JavaScript运行时错误:[$ rootScope:inprog] http://localhost:36167/Scripts/AngularJS/angular.min.js $ rootScope / inprog?p0 =%24diges

2 个答案:

答案 0 :(得分:0)

在treeMenu脚本模板中,更改ng-repeat循环变量名称&#39; menu&#39;使用父变量名称&#39;菜单&#39;来防止命名错误。将其命名为&#39;子菜单&#39;

答案 1 :(得分:0)

这是我的错误实际页面的网址 - 路径是正确的,我已使用正确的路径纠正。谢谢大家的帮助。这对我来说很重要。

app.service("LayoutService", function ($http) {

    this.GetMenuMaster = function () {
        var response = $http({
            method: 'get',
            url: "/Layout/GetMenuMaster",
            params: {},
            cache: true
        })
        return response;
    };
});