2016-08-01 12 views
0

Ich versuche, Bedingungen für die Anzeige eines versteckten div. Ich möchte, dass nach Eingabe eines Wertes in das Textfeld "Name" und wenn wir auf den Suchlink klicken, der versteckte Block erscheinen sollte. Aber in meinem Code, wenn wir zuerst auf den Suchlink klicken und dann einen Wert in das Textfeld eingeben, erscheint auch das versteckte div. Aber ich brauche das nur, nachdem ich Wert in das Textfeld eingegeben habe, wenn wir auf die Suche klicken, dann sollte nur das versteckte div erscheinen. Iam unten Code für das Verstecken der div-Wie geschachtelte Bedingungen zum Anzeigen eines versteckten Blocks mit angular js verwendet werden

<div ng-show="name.length>0 && IsVisible"> 

und in Skript Ich schreibe dies code-

$scope.isVisible = false; 

    $scope.ShowHide = function() { 


       //If DIV is hidden it will be visible and vice versa. 
       $scope.IsVisible = true; 
      } 

ich Plunker hier-

https://plnkr.co/edit/oVwZONrn4gtQs1BaiMbO?p=preview

erstellt haben

Can Irgendwelche helfen mir wie kann ich das erreichen?

Antwort

0

Sie sollten eine Bedingung in der Methode hinzufügen ShowHide selbst:

$scope.ShowHide = function() { 
    if($scope.name) { 
     //If DIV is hidden it will be visible and vice versa. 
     $scope.IsVisible = true; 
    } 
}  

Wenn Sie den versteckt Abschnitt möchte nur sichtbar, wenn ‚Suche‘ geklickt wird, dann ändert wie pro folgende in die HTML-Datei:

<div ng-show="IsVisible"> 

zur Demo siehe here

0

Überprüfen Sie diese plnkr. Hinzugefügt eine Uhr auf Namensänderung:

<input type="text" name="name" class="form-control" ng-change="resetShowHide()" ng-class="" ng-model="name" required/> 

und wenn der Name Länge 0, zurückgesetzt wird IsVisible

$scope.resetShowHide = function(){ 
    if($scope.name.length) $scope.IsVisible = false; 
    }