AngularJS ng-model을 사용하지 않고 상위 확인란을 자식과 바인딩해야합니다.

Question

API 호출을 통해 ng-repeat을 사용하여 사용자 목록을 얻었습니다. 각 사용자마다 5 개의 카테고리가 있으며 각 카테고리에는 true/false에 2-3 개의 승인이 있습니다.

user/category/authorization마다 승인 값을 변경하는 체크 박스가 필요합니다.

사용자의 확인란을 선택하면 모든 5 가지 범주 + 모든 권한이 true이고 사용자의 권한 또는 범주가 선택 취소 된 경우 그의 체크 박스는 false이됩니다.

그래서 제가 요약하면 : parent(User), child(Category) 및 그랜드 child(Authorization)입니다.

나는 우리가 ng-checked로하지만 내 체크 박스 ng-model를 사용할 수있는 것을보고는 ng-model이 더 이상 작동 boolean authorization (ng-model="authorization.Enabled")과 1 명 이상의 아이를 위해 사용된다.

이 사례를 어떻게 관리 할 수 ​​있습니까? $watcher이 필요하십니까?

도움 주셔서 감사합니다.

Answer 1

각 자식/그랜드 자식에 대해 ng-click을 사용할 수 있습니다. 부모 개체 (사용자 또는 카테 고리) 개체를 전달하고 특정 조건에서 부울 값을 수정합니다 (모든 자식이 참이거나 그렇지 않은 경우) ng-click과 ng-model을 함께 사용하면 안됩니다. 부모 (사용자 또는 카테터 리) 확인란을 클릭하고 ng 클릭하십시오.

vm.authorizationCheckboxClick = function (user,category, authorization) { 
authorization.booleanValue = !authorization.booleanValue; 
if (authorization.booleanValue){ 
    category.booleanValue = true; 
    category.authorizations.forEach(function(element) { 
     if(!element.booleanValue){ 
     category.booleanValue = false; 
     break; 
     } 
    }, this); 
} 
else { 
    category.booleanValue = false; 
} 

if (category.booleanValue){ 
    user.booleanValue = true; 
    user.categories.forEach(function(element) { 
     if(!element.booleanValue){ 
     user.booleanValue = false; 
     break; 
     } 
    }, this); 
} 
else { 
    user.booleanValue = false; 
} 
} 

이 예제는 권한 부여 값을 변경 한 다음 상위 카테고리 및 사용자의 부울 값을 변경하는 기능입니다. 이 값을 ng 확인 지시문에 바인딩 할 수 있습니다.