Denetleyiciden div'in AngularJS'de gizlenip gizlenmediğini kontrol edin.

Question

HTML'mde açısal/gizem kullanarak sakladığım/gösterdiğim bir div var, ancak denetleyicide gizlenip gizlenmediğini nasıl kontrol edeceğimi bilmek istiyorum.

Şimdiye kadar bulduğum her türlü çözüm jQuery, ng-hide öğesini bulmak için 'hasClass' kullanılarak hazırlanmıştır, ancak jQuery kullanmak istemiyorum.

Benim div benim denetleyicisinden düşünce bu

<div class="item item-input" ng-show="showDetails"></div> 

<button class="button button-block button-light leftTextButton" 
ng-click="showDetails = ! showDetails; updateTimes()"> 
<i ng-class="{'icon icon ion-minus-round': showDetails, 
'icon icon ion-plus-round': !showDetails}"></i> End Time</button> 

Sadece diyebiliriz benziyor ($ scope.showDetails) ve bu doğru veya yanlış dönecekti ama tanımsız ise.

Denetleyiciden gizlendiyse veya gösteriliyorsa nasıl bir div olup olmadığını nasıl kontrol edebilirim? Teşekkürler

Answer 1

Sanırım bir kapsam belirleme sorununuz var. Bunu kontrol edecek işleve aktarmak en iyi bahistir. Aksi takdirde, kapsam, denetleyiciye erişebilmelidir.

angular.module('MyApp', []) 
 
    .controller('MyController', ['$scope', 
 
    function($scope) { 
 
     $scope.myBoolean = false; 
 

 
     $scope.checkMyBooleanOnScope = function() { 
 
     alert($scope.myBoolean); 
 
     }; 
 

 
     $scope.checkMyOtherBooleanOnScope = function() { 
 
     alert($scope.myOtherBoolean); 
 
     }; 
 

 
     $scope.checkBooleanByPassingIt = function(bool) { 
 
     alert(bool); 
 
     }; 
 
    } 
 
    ]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="MyApp" ng-controller="MyController"> 
 
    <p>myBoolean predefined in the controller:{{myBoolean}} 
 
    <input type="checkbox" ng-model="myBoolean" /> 
 
    </p> 
 
    <p> 
 
    <button ng-click="checkMyBooleanOnScope()">checkMyOtherBooleanOnScope</button> 
 
    <button ng-click="checkBooleanByPassingIt(myBoolean)">checkMyBooleanByPassingIt</button> 
 

 
    </p> 
 
    <p>myOtherBoolean defined on the page with ng-model:{{myOtherBoolean}} 
 
    <input type="checkbox" ng-model="myOtherBoolean" /> 
 
    </p> 
 
    <p> 
 
    <button ng-click="checkMyOtherBooleanOnScope()">checkMyBooleanOnScope</button> 
 
    <button ng-click="checkBooleanByPassingIt(myOtherBoolean)">checkMyOtherBooleanByPassingIt</button> 
 
    </p> 
 

 
</div>