2

İç içe geçmiş öğeler için ng sınıfı kullanarak sınıflandırma uygulaması Menü öğelerini aşağıdaki biçimde görüntülüyorum. data, öğelerin listesini içerir ve her öğe için bir alt öğe vardır. subitem için selected sınıfını seçmem gerekiyor ve diğer tüm alt öğeler için tüm öğeler deselected olmalıdır. Denetleyicide bunun nasıl yapılacağı. Html içinde ng-click olayını ekleyerek ve denetleyicinin içindeki sınıfı değiştirerek denedim, ancak diğer öğelerin içindeki diğer tüm alt öğeler için geçerli değil. Daha fazla ayrıntı için hem html hem de denetleyici kodu aşağıda gösterilmiştir. Benim denetleyicisi İçindeAngularjs

<ol ng-model="data"> 
    <li ng-repeat="item in data" collapsed="true"> 
    <div ng-click="toggle(this)"> 
     <a class="btn btn-success btn-xs" ng-if="item.children && item.children.length > 0">{{item.name}}</a> 
    </div> 
     <ol ng-model="item.children" ng-class="{hidden: collapsed}"> 
     <li ng-repeat="subItem in item.children" ng-model="subItem.name" collapsed="true" ng-click="handleClick(subItem)"> 
      <div ng-class="{'selected-li': subItem.value, 'deselected-li': false}"> 
        {{subItem.name}} 
      </div> 
     </li> 
     </ol> 
    </li> 
    </ol> 

ben aşağıdaki kodu yaşıyorum:

$scope.toggle = function (scope) { 
    scope.toggle(); 
}; 

$scope.handleClick=function(subitem){ 
    subitem.value = subitem.value ? !subitem.value: true; 
} 

UI içinde kullanılan data nesne çocuklar da içeriyor. Lütfen nerede yanlış gittiğimi bana bildirin.

cevap

1

HTML

<li ng-repeat="subItem in item.children" ng-model="subItem.name" collapsed="true" ng-click="handleClick($index, item.children)"> 
     <div ng-class="{'selected-li': subItem.value, 'deselected-li': false}"> 
       {{subItem.name}} 
     </div> 
</li> 

JS burada ne işim deyişle, alt öğe ve tüm item.children dizinin indeks ng gönderilir Ne

$scope.handleClick = function(index, subItems) { 
    for(var i = 0; i < subItems.length; i++) { 
     if(i == index) { 
      subItems[i].value = true; 
     } else { 
      subItems[i].value = false; 
     } 
    } 
} 

-click işleyici yöntemi ve daha sonra bir for döngüsünde o listedeki tüm alt öğelerin değerini güncelliyorum.