Popover not working after adding other functions

ionic-v1
1

Hi everyone, I am creating some popover window in my ionic.
Originally I have tested and they were working to display to popover.
But after I have added some codes for other functionality, then the popover window did not shown up.
When I clicked on a button, the whole screen with be cover with a gradient layer (as the background of the popover window). But I can’t see any window appear on my screen. I can quit the gradient layer by clicking any space on my screen.

And below are my codes:

<button class="button icon ion-gear-a" ng-click="popover.show($event)"></button>

<script id="templates/popover.html" type="text/ng-template">
  <ion-popover-view style="height:160px; width:100px; text-align:center;">
    <ion-content>
      <div class="list">
        <a class="item" href="#">Chinese</a>
        <a class="item" href="#">English</a>
        <a class="item" href="#">Setting</a>
      </div>
    </ion-content>
  </ion-popover-view>
</script>

myIonic.controller('AppCtrl', function($scope, $ionicPopover) {

  $ionicPopover.fromTemplateUrl('templates/popover.html', {
    scope: $scope,
  }).then(function(popover) {
    $scope.popover = popover;
  });

});