AngularJs ng-show auf spezifischem Element

Question

Ich muss eine Prog-Leiste auf Element geklickt zeigen. das ist mein .jsp:

list.jsp

<div class="mb-pane" ng-style="{height: panelsHeight}"> 
<file-system-meeting refresh="global.refreshMeetings"></file-system-meeting> 

contentList.jsp:

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %> 

<!-- the "more" button and "actions buttons". This should be refactored 
<div class="pull-right"></div>--> 

<!-- the core meeting display stuff. Really really simple. We should take care of the forced "size". --> 
<div class="media"> 
    <div class="media-left"> 
    <!-- ng-click='progressRun()' --> 
     <a href="#meetings/{{meeting.id}}" ng-click="progressRun($event)" > 
      <!-- <img ng-if="meeting.iconId" class="mb-repo-icon" ng-src="<c:url value="/restful/meetings/" />{{meeting.id}}/icons/{{meeting.iconId}}/thumbnail" /> --> 
      <img ng-if="!meeting.iconId" class="mb-repo-icon" src="<c:url value="/img/thumbnail.png" />" /> 
     </a> 
    </div> 
    <div class="media-body"> 
     <h3>{{ meeting.titolo }}</h3> 
     <h4>Sub Title</h4> 
     <h6>Creato Da: {{meeting.autore}}</h6> 
     <div id="prog" class="progress" ng-show="runp"> 
      <div class="progress-bar" role="progressbar" aria-valuenow="60" aria-valuemin="0" aria-valuemax="100"> 
       60% 
      </div> 
     </div> 
    </div> 
    <div class="media-right"> 
     <h5>Part: {{meeting.num_partecipanti}}</h5> 
     <h5>Doc: {{meeting.num_doc}}</h5> 
     <h5>Durata: {{meeting.durata}} min</h5> 
    </div> 
</div> 

Wie kann Fortschrittsbalken auf einem angeklickt Element angezeigt werden?

Danke.

Answer 1

Sie können eine Funktion verwenden, um einen Bereich festzulegen.

so in Ihrem Controller würden Sie so etwas wie dieses:

$scope.functionName = function() { 
    $scope.trueValue = true; 
} 

Sie dann ng-Show auf dem Element verwenden Sie so etwas wie dieses ng-show = "truevalue"

zeigen wollen Sie müssen auch scope.trueValue definieren .. auch aus dieser Funktion falsch sein, wenn Sie den wahren Wert wechseln wollen Sie müssen nur das tun in der Funktion:

$scope.functionName = function() { 
    $scope.trueValue = !$scope.trueValue; 
} 

Answer 2

Es sei thi s ist Ihre Klickelement

<a href="#meetings/{{meeting.id}}" ng-click="progressRun($event)" > 
       <!-- <img ng-if="meeting.iconId" class="mb-repo-icon" ng-src="<c:url value="/restful/meetings/" />{{meeting.id}}/icons/{{meeting.iconId}}/thumbnail" /> --> 
       <img ng-if="!meeting.iconId" class="mb-repo-icon" src="<c:url value="/img/thumbnail.png" />" /> 
      </a> 

// Controller-JS

$scope.runp = false; 

$scope.progressRun = function ($event) { 
    $scope.runp = true; 

}