title: Binding in directive linking not working
body: <p>I am trying to make a simple directive work which will simply return uppercase text. The text is passed from a controller through a binding.</p>
  
  <p>The basic idea is:</p>
  
  <pre><code>&lt;div ng-controller="MainCtrl as main"&gt;
  
      &lt;div uppercase&gt;{{main.message}}&lt;/div&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>And my main JS file is as follows:</p>
  
  <pre><code>angular.module('app', [])
  
  .controller('MainCtrl', function(){
      this.message = 'hello world'
  })
  
  .directive('uppercase', function() {
      return {
          restrict: 'A',
          transclude: true,
          template: '&lt;span ng-transclude&gt;&lt;/span&gt;',
          link: function(scope, el, attr) {
              el.text() = el.text().toUpperCase();
          }
      }
  })
  </code></pre>
  
  <p>Also my jasmine test is as follows:</p>
  
  <pre><code>describe("App", function() {
  
      var $compile
      ,   $rootScope
      ,   $controller
      ,   MainCtrl
      ,   element;
  
    beforeEach(module('app'))
  
    beforeEach(inject(function(_$compile_, _$rootScope_, _$controller_){
  
      $compile = _$compile_;
      $rootScope = _$rootScope_;
      $controller = _$controller_;
  
      MainCtrl = $controller('MainCtrl');
  
  
  
    }))
  
    describe("MainCtrl", function() {
      it("should have a message property", function() {
        expect(MainCtrl.message).toBe('hello world');
      });
    });
  
    describe("Uppercase directive", function() {
      it("should return uppercase text", function() {      
  
        element = '&lt;p superman&gt;{{MainCtrl.message}}&lt;/p&gt;';
  
        element = $compile(element)($rootScope);
  
        $rootScope.$digest();
  
        expect(element.text()).toBe('HELLO WORLD');
      });
    });
  
  
  });
  </code></pre>