jquery - le modèle de liste de contrôle ne peut pas écrire d'objets vérifiés dans le modèle de liste de contrôle lors de l'utilisation de attr

Question

Le projet doit afficher une liste de cases à cocher, sélectionner un élément dans la liste de cases à cocher A et cocher automatiquement l'élément correspondant dans la liste de cases à cocher B. En utilisant actuellement le composant checklist-model, lorsqu'un élément est vérifié, la valeur est stockée dans selectedLists. La vérification peut désormais être réalisée, mais lorsque l'élément dans B est automatiquement vérifié, la valeur sélectionnée n'est pas écrite dans les listes sélectionnées.

Publiez le code maintenant, bienvenue pour en discuter

code html

<p class='panel-body' id='aList'>
    <p ng-repeat='aList in aLists'>
        <input type="checkbox" ng-click='show($event,aList.id)'>{{aList.name}}
    </p>
</p>
<p class='panel-body' id='bList'>
    <p ng-repeat='bList in bLists track by $index'>
        <input type="checkbox" checklist-model='selectedLists' checklist-value='bList' 
               data-parent-id='{{bList.id}}'>
        {{bList.name}}
    </p>
</p>

code js

<script type="text/javascript">
    $scope.selectedLists= [];
    
    $scope.show = function(event,id){
    var checkBox = $(event.target);
    var cValue = id;
    var isCheck = checkBox.prop('checked');
    $("#bList input").each(function(){
        if(cValue == $(this).data('stationId')){
            $(this).prop('checked',isCheck);//这里设置勾选状态
        }
    });
}
</script>

Si vous avez des questions, corrigez-moi. Merci à tous.

Answer 1

Puisque angulaire est utilisé, pourquoi devrions-nous utiliser des idées jquery pour écrire du code ?
Lier ng-model à l'entrée pour surveiller l'état sélectionné, puis utiliser la comparaison de modèles pour contrôler si une autre entrée est sélectionnée
Contrôle via le rendu de l'interface utilisateur des données, ceci est le concept de frameworks comme ng