使用Angular.js做分类列表

Z时代
2024-01-10
分类：IT

图片描述
像这种分类列表，以前用ASP.Net MVC从后台取数据做分类列表的时候，要用2个嵌套的foreach，里面先判断item.cParentId == -1，再判断subitem.cParentId == item.cId，这样才能把分类列表做出来，cshtml代码如下：

<div class="panel-group" id="accordion">
                    @{
                    var plist = ViewBag.categoryList as List<Category>;
                    if (plist != null && plist.Any())
                    {
                        foreach (var item in plist)
                        {
                            //生成一级菜单
                            if (item.cParentId == -1)
                            {
                                var accordionUrl = "collapse" + item.cId;
                                <div class="panel panel-default">
                                    <div class="panel-heading">
                                        <h4 class="panel-title">
                                            <a data-toggle="collapse" data-parent="#accordion"
                                               href="#@accordionUrl">
                                                @item.cName
                                            </a>
                                        </h4>
                                    </div>
                                    <div id="@accordionUrl" class="panel-collapse collapse">
                                    //生成二级菜单
                                        @foreach (var subitem in plist)
                                        {
                                            if (subitem.cParentId == item.cId)
                                            {
                                                <a href="/home/category/@subitem.cId" class="list-group-item">@subitem.cName</a>
                                            }
                                        }
                                    </div>
                                </div>
                            }
                        }
                    }
                }
            </div>