Question

我有两个范围变量，如下所示：

 $scope.degrees =[{DegreeCategoryID:"1",DegreeCategory:"Accounting",DegreeCategoryType:"Applied Sciences"},
                {DegreeCategoryID:"2",DegreeCategory:"Advanced Manufacturing/Mechatronics Technology",DegreeCategoryType:"Applied Sciences"},
                {DegreeCategoryID:"3",DegreeCategory:"Air Conditioning and Refrigeration Technology",DegreeCategoryType:"Applied Sciences"},
                {DegreeCategoryID:"4",DegreeCategory:"Auto Body Technology",DegreeCategoryType:"Applied Sciences"},
                {DegreeCategoryID:"78",DegreeCategory:"Associate in Sciences",DegreeCategoryType:"Academic"},
                {DegreeCategoryID:"79",DegreeCategory:"Associate of Arts in Teaching",DegreeCategoryType:"Academic"},
                {DegreeCategoryID:"80",DegreeCategory:"Emphasis",DegreeCategoryType:"Academic"},
                {DegreeCategoryID:"81",DegreeCategory:"Field of Study",DegreeCategoryType:"Academic"}];

$scope.degreecategories=[{DegreeID:"1",DegreeCategoryID:"1",Degree:"Accounting AAS ",DegreeTypeID:"2",BHC:"1",CVC:"1",EFC:"1",ECC:"1",MVC:"1",NLC:"1",RLC:"1",Description:""},
            {DegreeID:"2",DegreeCategoryID:"1",Degree:"Accounting Assistant Certificate ",DegreeTypeID:"1",BHC:"1",CVC:"1",EFC:"1",ECC:"1",MVC:"1",NLC:"1",RLC:"1",Description:""},
            {DegreeID:"3",DegreeCategoryID:"1",Degree:"Accounting Clerk Certificate ",DegreeTypeID:"1",BHC:"1",CVC:"1",EFC:"1",ECC:"1",MVC:"1",NLC:"1",RLC:"1",Description:""},
            {DegreeID:"4",DegreeCategoryID:"1",Degree:"Advanced Technical Certificate in Professional Accountancy",DegreeTypeID:"1",BHC:"",CVC:"",EFC:"",ECC:"",MVC:"1",NLC:"",RLC:"",Description:""},
            {DegreeID:"5",DegreeCategoryID:"2",Degree:"Advanced Manufacturing/Mechatronics Technology AAS ",DegreeTypeID:"2",BHC:"",CVC:"",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""},
            {DegreeID:"6",DegreeCategoryID:"2",Degree:"Advanced Manufacturing/Mechatronics Technology Certificate ",DegreeTypeID:"1",BHC:"",CVC:"",EFC:"1",ECC:"",MVC:"1",NLC:"",RLC:"",Description:""},
            {DegreeID:"7",DegreeCategoryID:"3",Degree:"Air Conditioning and Refrigeration Technology AAS ",DegreeTypeID:"2",BHC:"",CVC:"",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""},
            {DegreeID:"8",DegreeCategoryID:"3",Degree:"Profit Center Manager Enhanced Skills Certificate ",DegreeTypeID:"1",BHC:"",CVC:"",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""},
            {DegreeID:"9",DegreeCategoryID:"3",Degree:"Residential - Technician I Certificate ",DegreeTypeID:"1",BHC:"",CVC:"1",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""},
            {DegreeID:"10",DegreeCategoryID:"3",Degree:"Residential - Technician III Level II Certificate ",DegreeTypeID:"1",BHC:"",CVC:"1",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""},
            {DegreeID:"11",DegreeCategoryID:"3",Degree:"Residential AAS ",DegreeTypeID:"2",BHC:"",CVC:"1",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""},
            {DegreeID:"12",DegreeCategoryID:"4",Degree:"Auto Body Metal Technician Certificate ",DegreeTypeID:"1",BHC:"",CVC:"",EFC:"1",ECC:"",MVC:"",NLC:"",RLC:"",Description:""}];

我的上述变量都存在于同一个控制器中。我试图以这样的方式显示数据：当我点击名为＆＃39; Academic＆＃39;的按钮时，它会使用过滤器显示来自DegreeCategoryType:"Academic"的所有$scope.degrees个变量。（到此为止）它工作正常）

现在我想根据列表中的选择显示上一个列表之后的另一个列表，即。当我从上面列出的列表中单击一个选项时，我想显示$scope.degreecategories中的详细信息，使其匹配并根据DegreeCategoryID进行过滤。我该如何处理这个问题？我已经发布了这个问题，但我试图表达的信息不合适。

Answer 1

        <a href='#' ng-repeat="degree in degrees | filter:{DegreeCategoryType:'Applied Sciences'}" class="list-group-item">
                      <li ng-click="display.appliedsciencescourse" >{{degree.DegreeCategory}}</li>
                    </a>

我看不到你的ng-click实际上做了什么。如果您的ng-click调用一个函数，将单击的元素作为参数应用，那么您可以在第二个列表中设置$ scope.selectedCategory = yourcategory，您可以按范围内的selectedCategory进行过滤。

Answer 2

MARKUP主列表

        <div ng-show="display.academic" class="col-lg-4 col-md-4 col-sm-4">
            <div class="panel panel-info list-group list-unstyled" data-spy="scroll" data-target="#panelcategory" data-offset="0" style="max-height:300px;overflow:auto;position:relative;">
                <div class="panel-heading">
                    <h3 class="panel-title">Academic</h3>
                </div>
                    <a href='#' ng-repeat="degree in degrees | filter:{DegreeCategoryType:'Academic'}" class="list-group-item">
                      <li ng-click="showAcademic(degree)" >{{degree.DegreeCategory}}</li>
                    </a>
            </div>
        </div>

标记子列表

        <div ng-show="display.academiccourse" class="col-lg-9 col-md-9 col-sm-9">
            <div class="panel panel-info list-group list-unstyled" data-spy="scroll" data-target="#panelcategory" data-offset="0" style="max-height:300px;overflow:auto;position:relative;">
                <div class="panel-heading">
                    <h3 class="panel-title">{{DegreeCategory}}</h3>
                </div>
                    <a href='#' ng-repeat="degree in degreecategories | filter:{DegreeCategoryID:filterSub}" class="list-group-item">
                      <li ng-click="display.appliedsciencescourse" >{{degree.Degree}}</li>
                    </a>
            </div>
        </div>

<强> JS

$scope.showAcademic = function(degree){
    $scope.DegreeCategory = degree.DegreeCategory;
    $scope.filterSub = degree.DegreeCategoryID;
    $scope.display.academiccourse = true;
};

在同一控制器中使用范围变量进行角度循环

2 个答案: