将单个服务逻辑应用于两个类似的按钮

我的ReverseService服务中有一个函数。我在controller中使用此service。在ng-click上调用它。问题是，我为两个ng-click调用了同一个函数，因此在我希望它只应用于一个（我单击的那个）的地方被应用于这两个函数。我知道为什么会发生这种情况，但我无法想出解决方案。这是代码
HTML

<div id="sidebar" ng-controller="SideCtrl">
            <!-- here goes a static sidebar -->
            <div class="large_3_custom columns">
                <ul class="side-nav side_nav_custom">
                    <li>
                        <img src="images/dashboard.png" alt="">
                        <a href="#">DASHBOARD</a>
                    </li>
                    <li>
                        <img ng-src="images/company_profile.png" alt="">
                        <a href="#">COMPANY PROFILE</a>
                        <img ng-src="{{images.current}}" ng-click="swapHere();subSec = !subSec" id="arrowRotate">
                    </li>
                    <li ng-show="subSec">
                        <img src="" alt="">
                        <a href="#">SERVICES</a>
                    </li>
                    <li ng-show="subSec">
                        <img src="" alt="">
                        <a href="#">EMPLOYEES</a>
                    </li>
                    <li>
                        <img src="images/statistics.png" alt="">
                        <a href="#">STATISTICS</a>
                    </li>
                    <li>
                        <img src="images/reviews.png" alt="">
                        <a href="#">REVIEWS</a>
                    </li>
                    <li>
                        <img src="images/tips_advice.png" alt="">
                        <a href="#">TIPS & ADVICE</a>
                    </li>
                    <li>
                        <img src="images/deals.png" alt="">
                        <a href="#">DEALS</a>
                    </li>
                    <li>
                        <img src="images/media.png" alt="">
                        <a href="#">MEDIA</a>
                    </li>
                    <li>
                        <img src="images/price_list.png" alt="">
                        <a href="#">BOOKING</a>
                        <img ng-src="{{images.current}}" ng-click="swapHere();bookSec = !bookSec" id="arrowBook">
                    </li>
                    <li ng-show="bookSec">
                        <img src="" alt="">
                        <a href="#">CALENDAR</a>
                    </li>
                    <li>
                        <img src="images/market.png" alt="">
                        <a href="#">MARKET</a>
                    </li>
                    <li>
                        <img src="images/sponser_deal.png" alt="">
                        <a href="#">SPONSOR A DEAL</a>
                    </li>
                    <li>
                        <img src="images/extra_services.png" alt="">
                        <a href="#">EXTRA SERVICES</a>
                    </li>
                </ul>
            </div>
        </div>  

角度

var myApp = angular.module("myApp", []);
myApp.service("ReverseService", function() {
    // service func goes here --
    this.imgSwap = function(images) {
        if (images.current === images.finalImage) {
            images.current = images.initialImage;
        } else if (images.current === images.initialImage) {
            images.current = images.finalImage;
        }
    };
});
myApp.controller("SideCtrl", function($scope, ReverseService) {
    console.log("thomas");
    $scope.myData = {};
    $scope.images = {
        initialImage: "images/prof_arrow1.png",
        finalImage: "images/prof_arrow.png",
        current: "images/prof_arrow1.png"
    };
    $scope.swapHere = function() {
        ReverseService.imgSwap($scope.images);
    };
    $scope.subSec = false;
    $scope.bookSec = false;
});

这是一个Plunker。