div in Angular anzeigen/verbergen

Question

Ich habe Datum und Uhrzeit in zwei verschiedenen Div. Ich habe zwei Kontrollkästchen 1. Hinzufügen von zusätzlichen- Es wird eine weitere div von jedem Datum und Uhrzeit hinzufügen 2. Zeit/Datum wird gleich sein- Es wird nur Datum div hinzufügen. muss Zeit div verstecken

HTML

<input type="checkbox" ng-click="addMore(keyAdd);" ng-model="keyAdd"> <label for="dateCheck">Add Additional</label> &nbsp; &nbsp; 
<input type="checkbox" ng-model="keyOnlyDate"> <label for="configDate">Time/Place will be the same</label> 

-Controller

$scope.addMore = function(Attr) { 
    if (Attr && $scope.keyCount <= 2 && $scope.keyOnlyDate == false) { 
     $scope.selects.push({}); 
     $scope.keyCount++; 
     $scope.keyAdd = false; 
     $scope.keyOnlyDate = false; 
    } else if (Attr && $scope.keyCount <= 2 && $scope.keyOnlyDate == true) { 
     $scope.selects.push({}); 
     $(".timePiker").hide(); 
     $scope.keyCount++; 
     $scope.keyAdd = false; 
     $scope.keyOnlyDate = false; 
    } 
} 

ich brauche nur die timePiker basierend auf den Indexwert zu verstecken. Wie geht das?

Answer 1

können Sie

ng-show ="expression" 

oder

ng-hide ="expression" 

ng-if ="expression" //in this case it will be removed from Dom 

zum Beispiel

<input type="checkbox" ng-click="addMore(keyAdd);" ng-model = "keyAdd" > <label for="dateCheck" ng-if ="keyOnlyDate ">Add Additional</label> 

Answer 2

Oder Sie können ng-Klasse verwenden, verwenden. Ich empfehle ng-class, weil Sie flexibler sind und Sie damit schöne Animationen erstellen können, zum Beispiel können Sie Elemente transformieren oder drehen.

ng-class="{'active': expression}"