2015-10-13 10 views
6

mam ten popover z szablonuui.bootstrap popover blisko na kliknij

<i class="fa fa-link" popover-placement="right" uib-popover-template="'newReferenceTemplate.html'" popover-title="New link"> Add new external reference </i> 

Więc po kliknięciu na tę ikonę łącza, A popover otwiera witht tym tamplate

<script type="text/ng-template" id="newReferenceTemplate.html"> 
    <label>Title</label> <br> 
    <input ng-model="link.Title"> <br> 
    <label>Url</label> <br> 
    <input ng-model="link.Url"><br> 
    <i class="fa fa-floppy-o" > Save </i> 
</script> 

Po naciśnięciu, że " floppy "ikona, chciałbym zamknąć popover. Czy są na to jakieś sposoby?

Wszystko, co mogę znaleźć: on documentation to wartość popover-is-open, ale nie wiem, czy mogę w jakiś sposób to wykorzystać, jakieś myśli?

+1

Znaleziono plunkr że właśnie to robi: http://plnkr.co/edit/QhshtRqwpdsirvdFj9JG?p=preview – JasperZelf

+1

To jest ... dużo kodu dla tylko, że będę próbować rozszyfrować go i zobacz, co wymyśliłem, dzięki za odpowiedź – klskl

Odpowiedz

7

Krok 1: Dodaj popover-is-open="isOpen" do łącza spustowego.

<i class="fa fa-link add-link" 
     popover-placement="right" 
     uib-popover-template="'newReferenceTemplate.html'" 
     popover-is-open="isOpen" 
     popover-title="New link"> Add new external reference </i> 

Krok 2: Po kliknięciu na ikonę dyskietki wewnątrz popover ustaw isOpen false:

Jest to ikona zaoszczędzić na popover:

<i class="fa fa-floppy-o" ng-click="save()"> Save </i> 

Jest to kontroler:

$scope.save = function() { 
    $scope.isOpen = false; 
}; 

Zobacz plunker

Powiązane problemy