AngularJS Directive Scope

HTML

<div ng-app="scopePropertiesModule">
  <div ng-controller="Ctrl3">
  <one val={{arr[1].value}}> </one>
  <two val="arr[0].value"> </two>
  </div>
</div>

JavaScript

function Ctrl3($scope) {
  $scope.title = 'My relevant title';
  $scope.arr = [
  {name:123, value:'3806wwer32141113'},
  {name:123, value:'3806we222wrer32141113'},
  {name:123, value:'3806wer32141113'},
  {name:123, value:'3806wer32141113'},
  {name:123, value:'3806wer32141113'}
  ];
    $scope.displayTitle = function() {
        return $scope.title;    
    }        
}

angular.module('scopePropertiesModule', [])
  .directive('one', function(){
    return {
      restrict: 'E',
      scope: {
      val:'@'
      },
      template: '<div> 1111 {{val}} </div>' ,
      link: function (scope,elum,attr) {
      attr.$observe('val', function(value) { console.log('scope', scope.val) })
      //console.log('scope', scope.val)
      if(scope.val) scope.val =	scope.val.replace(/\d/g,'')
      
      
      }
    }
  })
    .directive('two', function(){
    return {
      restrict: 'E',
      scope: {
      val:'='
      },
      template: '<div> 2222 {{val}} </div>' ,
       link: function (scope) {
        scope.val = 	scope.val.replace(/\d/g,'')
      console.log('scope', scope.val.replace(/w/, ''))
      }
    }
  });