JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.10.0/ui-bootstrap.min.js"></script>
<body ng-app="docsIsolateScopeDirective">
    <div ng-controller="Ctrl">
    <my-customer info="naomi"></my-customer>
    <hr>
    <my-customer info="igor"></my-customer>
  </div>
</body>

JavaScript

angular.module('docsIsolateScopeDirective', [])
    .controller('Ctrl', function($scope) {
      $scope.naomi = { name: 'Naomi', address: '1600 Amphitheatre' };
      $scope.igor = { name: 'Igor', address: '123 Somewhere' };
      
      $scope.$watch("naomi.name", function(n,o){console.log(n)}, true);
    })
    .directive('myCustomer', function() {
      return {
        restrict: 'E',
        scope: true,
        template: '<div>Name: <input type="text" ng-model="naomi.name" /> Address: {{customerInfo.address}}</div>'
      };
    });