attrs obj in directive link fn showing conflicting data

[kenneth...@gmail.com]

I have the following directive.

dwibbles.directive('timeAgo', function(moment) {

  return {

    link: function(scope, element, attrs) {

      console.log(attrs);

      element.text(attrs.timeAgo);    

    }

  };

});

I'm trying to pull the time-ago attribute value in my html. However, when I output attrs to the console, it shows conflicting timeAgo values. Any ideas? I've attached an image of my console output.

[Peter Bacon Darwin]

It would be helpful to see the way in which you are setting the attribute.  I suspect that you are using {{}} interpolation?

The reason is that the attribute is not interpolated until the next digest, which happens after the link function finishes.  So in your console you are seeing the initial value, as it is at link time and but the console is then updating the value after the digest when the attr is interpolated.

Pete

--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To post to this group, send email to ang...@googlegroups.com.
To unsubscribe from this group, send email to angular+u...@googlegroups.com.
Visit this group at http://groups.google.com/group/angular?hl=en.
 
 

[Ken Koontz]

Yep I'm setting the attribute with interpolation.

[Peter Bacon Darwin]

So for now the solution is to $interpolate it manually in the link function or wait until the digest has run:

Manual interpolate:

function($interpolate) {

return {

  link: function(scope, element, attrs) {

    attrs.set('timeAgo', $interpolate(element.attr('time-ago'))(scope));

  }

}

Wait for digest:

link: function(scope, element, attrs) {

  attrs.$observe('timeAgo', function(value) {

    ...

  });

}

The second is the "official" solution for this.  I have a PR up that would make this all go away though: https://github.com/angular/angular.js/pull/1555

[Ken Koontz]

Peter. Thanks!

[Luis Ramón López]

El 19/11/12 02:22, kenneth...@gmail.com escribi�:

A bit off-topic, but if you intend to build a time-ago directive you may
have a look into this: http://jsfiddle.net/lrlopez/dFeuf/

It is based on the timeago jQuery plugin:
https://github.com/rmm5t/jquery-timeago

Best regards,
Luis Ram�n

[Ken Koontz]

Luis. Thanks for the reference.

On Mon, Nov 19, 2012 at 10:27 AM, Luis Ramón López <lrl...@gmail.com> wrote:

El 19/11/12 02:22, kenneth...@gmail.com escribió:

Luis Ramón