Problem with ion-content and scope vars inside function

ionic-v1
4

The problem is specific with ion-content because of the way this directive is defined in the Ionic source code. It specifically creates it’s own child scope.

.directive('ionContent', [
  '$parse',
  '$timeout',
  '$ionicScrollDelegate',
  '$controller',
  '$ionicBind',
function($parse, $timeout, $ionicScrollDelegate, $controller, $ionicBind) {
  return {
    restrict: 'E',
    replace: true,
    transclude: true,
    require: '^?ionNavView',
    scope: true,
    template:
    '<div class="scroll-content">' +
      '<div class="scroll"></div>' +
    '</div>',

Because of this and the way inheritance works in JavaScript, you cannot use 2 way binding. Basically your $scope.clickMe is defined in you controller and is just created as a new primitive to the scope of ion-content. It is not copied by reference like an object would be.

Reread that article I linked to. It’s critical in understanding how this all works and overcoming these issues.