scope test

by cm0s

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.1.5/angular.js"></script>
<div ng-app="app">
<div ng-controller="AppCtrl">
    
    <mytext text-model="text"></mytext>
    <button ng-click="inc()"></button>
</div>
</div>

JavaScript

angular.module('app', [])
    .controller('AppCtrl', function($scope, $http){
        console.log($scope);
       $scope.text = "hello";
        $scope.inc = function(){
      
            $scope.text =$scope.text + $scope.text;
        }
    })
    .directive('mytext', function () {
        return  {
            restrict: 'E',
            scope: {
                textModel: "="
            },
            template: '<p>{{textModel}}</p>',
           link: function (scope, element, attrs) {
        var span = angular.element(element.children()[0]);
        var form = angular.element(element.children()[1]);
        var input = angular.element(element.children()[1][0]);

        scope.$watch('editMode', function (newValue, oldValue) {
          if (newValue === true) {
            input[0].value = scope.text;
            startEdit();
          }
        });

        function startEdit() {
          bindEditElements();
          setEdit(true);
          input[0].focus();
        }

        function bindEditElements() {
          input.bind('blur', function () {
            if (input[0].value) {
              save();
            }
            stopEdit();
          });

          input.bind('keyup', function (event) {
            if (isEscape(event)) {
              stopEdit();
            }
          });

          form.bind('submit', function () {
            if (input[0].value) {
              save();
            }
            stopEdit();
          });
        }

        function save() {
          scope.text = input[0].value;
          scope.$apply();
          scope.onSave();
          scope.editMode = false;
        }

        function stopEdit() {
          unbindEditElements();
          setEdit(false);
          scope.editMode = false;
        }

        function unbindEditElements() {
          input.unbind();
          form.unbind();
        }

        function setEdit(value) {
          scope.editing = value;
        }

        function isEscape(event) {
  ...