如何使用angular.js自动检查其他指令中的元素?

时间:2016-03-30 09:39:50

标签: javascript angularjs angularjs-directive

我有一个树结构,我正在尝试使用angular指令检查和取消选中。这个想法是当其中一个节点被检查时,它应该自动检查其中的元素。代码我看起来像这样:

<div ng-repeat="actor in actors" style="margin-left: 46%;">

<div create-connections class="actor\{{$index}}" >

        <span><input class="checkbox-actor" type="checkbox" name="actor-checkbox"  id="" ng-value ="actor" ng-model="checkBoxModel" actor-box >\{{actor}}</span>

    <br/>
</div>



<div ng-repeat="activity in activities">

    <div ng-if="actor == activity.id" style="margin-left: -40%;">

        <div ng-repeat = "impact in activity.text" >
            <div update-connections class="impact\{{$index}}actor\{{actors.indexOf(actor)}}" actor-id="actor\{{actors.indexOf(actor)}}" id="">

                <span><input class="checkbox" type="checkbox" name="impact-checkbox" id=""  value="">\{{impact}}</span>

            </div>

            <div ng-repeat="feature in features">

                <div ng-if="actor == feature.id && impact == feature.key" style="margin-left: -25%;">

                    <div feature-connection ng-repeat = "feature in feature.text"class="feature\{{$index}}" activity-id="impact\{{activity.text.indexOf(impact)}}actor\{{actors.indexOf(actor)}}" id="">
                            <span><input class="checkbox" type="checkbox" name="impact-checkbox" id=""  value="">\{{feature}}</span>
                    </div>
                </div>

            </div>
        </div>

    </div>


</div>

第一个复选框元素的指令代码:

    angular.module('mainModule').directive('actorBox', function($interval) {
    return {
        restrict: 'EA',
        replace: false,
        scope: {
            ngModel:'='
        }
        /*require: 'createConnections','updateConnections', 'featureConnection'*/,
        /*transclude: true,*/

        link: function(scope, element, attrs) {
            console.log("checking the checkbox");
            console.log(element)
        }
    };
});

我也附上截图 enter image description here

1 个答案:

答案 0 :(得分:0)

像这样使用:

link: function(scope, element, attrs) {
   console.log("checking the checkbox");
   element.find('input[type="checkbox"]').prop('checked',true);
   console.log(element)
}