Get width of table cell in directive when that width is set dynamically in the template

OK... I have a template:

<th width="{{setWidth(1)}}%">{{deal}}</th>

I have a directive:

.directive('tableheaders', function($window,$compile) {
    return function(scope) {
    var th = document.getElementsByTagName('th');

    for (var i = 0; i < th.length; i++) {       
        console.log(th[i].width); // returns "{{setWidth(1)}}%" need "100%"
    }

How do I compile the value of width being sent so I can use it?

Answers


You can use $timeout or the jqLite function ready() to wait for the DOM to be ready and the {{setWidth(1)}}% to have been evaluated.

With $timeout:

app.directive('tableheaders', function($timeout) {
  return function(scope) {
    $timeout(function () {
      var th = document.getElementsByTagName('th');

      for (var i = 0; i < th.length; i++) {
        console.log(th[i].width);
      }
    });
  };
});

With ready:

app.directive('tableheaders', function() {
  return function(scope, element) {
    element.ready(function () {
      var th = document.getElementsByTagName('th');

      for (var i = 0; i < th.length; i++) {
        console.log(th[i].width);
      }
    });
  };
});

Or you can use $interpolate to perform the evaluation manually:

app.directive('tableheaders', function($interpolate) {
  return function(scope, element) {

    var th = document.getElementsByTagName('th');

    for (var i = 0; i < th.length; i++) {

      var expression = $interpolate(th[i].width);
      var width = expression(scope);
      console.log(width);
    }
  };
});

Need Your Help

Log4Net + Send Email when done?

log4net

I have just started playing around with Log4Net... I now want to send an email with the full log either attached or directly in the mail. The problem with using SmtpAppender is that it requires a

Logical operator OR without short circuit

java

When would you ever need to use the non short circuit logical operator or? In other words...

About UNIX Resources Network

Original, collect and organize Developers related documents, information and materials, contains jQuery, Html, CSS, MySQL, .NET, ASP.NET, SQL, objective-c, iPhone, Ruby on Rails, C, SQL Server, Ruby, Arrays, Regex, ASP.NET MVC, WPF, XML, Ajax, DataBase, and so on.