Set an element's attribute text/value through an angular directive?

Question

How do I set the text of an attr?

Trying to set the values of meta tags description through it's content attr.

<title  update-title></title>
<meta name="description" update-description content="">

I've created a simple 2 directive:

the first one works: This sets the title tag

app.directive('updateTitle', function($rootScope) {
  return {
    link: function(scope, element) {

      var listener = function(event, toState, toParams, fromState, fromParams) {
        var title = 'Default Title';
        if (toState.data && toState.data.pageTitle) {
            title = toState.data.pageTitle;
        }
        element.text(title)
      };

      $rootScope.$on('$stateChangeStart', listener);
    }
  }
})

this one doesn't work: Getting a TypeError because of .text()

app.directive('updateDescription', function($rootScope) {
  return {
    link: function(scope, element, attr) {

      var listener = function(event, toState, toParams, fromState, fromParams) {
        var desc = 'Default Description';
        console.log(toState.data);
        if (toState.data && toState.data.description) {
            desc = toState.data.description;

        }
        //getting a type error because i cant set the .text() of an attr.
        attr.content.text(desc);

      };

      $rootScope.$on('$stateChangeStart', listener);
    }
  }
})

Route:

.state('root.app.work', {
  url: 'work',
  data: {
    pageTitle: 'work',
    description: 'work desc'
  }
})

Answer 1

Change:

attr.content.text(desc);

to

attr.$set('content', desc);

You can see its documentation here