JSFiddle - React, Tailwind, and code Playground

by Mike Jacobson

HTML

<div ng-app="myapp" ng-controller="ctrl">

  <my-dir somevalue='something'></my-dir>

</div>

JavaScript

angular
.module('myapp', [])
.controller('ctrl', function($scope) {
  $scope.something = 'Something something something...';
})
.directive('myDir', function() {
	return {
  	restrict: 'E',
    template: `
    	<div class="overlay">
      	<span>{{somevalue}}</span>
      </div>
      <div>width: {{width}}</div>`,
    scope: {
    	somevalue: '='
    },
    link: function (scope, el, attrs) {
      var overlayElement = el[0].querySelector('.overlay');
      
      scope.width = overlayElement.clientWidth;
    }
  }

});