angular.module('problem', [])

  .directive('parent', parent)

  .directive('child', child);

​

function parent() {

  return {

    restrict: 'E',

    template: '<div><div><input type="text" ng-model="item"/><button ng-click="pctrl.hola()">HI</button></div><ng-transclude></ng-transclude></div>',

    controllerAs: 'pctrl',

    transclude: true,

    controller: function($scope) {

      $scope.item = 35;

      $scope.hola = function() {

        $scope.item = $scope.item + 1;

      };

    }

  };

}

​

function child() {

  return {

    restrict: 'E',

    scope: {

      item: '='

    },

    template: '<div><div><input type="text" ng-model="cctrl.item2"/><div></div></div></div>',

    bindToController: true,

    controllerAs: 'cctrl',

    controller: function() {

      this.item2 = this.item + 25;

    }

  };

}