JSFiddle - React, Tailwind, and code Playground

HTML

<html ng-app>
    
    <head></head>
    
    <body id='dim' ng-controller="Dimensions">
         <h1>Base Angular Fiddle</h1>

        <div id="someDiv">Width: {{docWidth}}
            <br/>Height: {{docHeight}}</div>
    </body>

</html>

CSS

html,body{height:100%;width:100%;}
#someDiv {
    margin:10px;
    padding:5px;
    width: 10%;
    height: 10%;
    background:rgb(240, 170, 170);
}
h1 {
    font-weight:bold;
}
p {
    margin-bottom:5px;
}

JavaScript

function Dimensions($scope) {
    $scope.docWidth = 0;
    $scope.docHeight = 0;
}

/*javascript external to angular applies to a scope*/

function tellAngular() {
    var domElt = document.getElementById('someDiv');
    scope = angular.element(domElt).scope();
    scope.$apply(function () {
        scope.docWidth = domElt.offsetWidth;
        scope.docHeight = domElt.offsetHeight;
    });
}
//calling tellAngular on resize event
window.onresize = tellAngular;