JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp">
    <div ng-controller="ParentCtrl">
        <h2>Parent</h2>
        <label>Foo: <input type="text" ng-model="foo"/></label>
        -
        <label>Bar.baz: <input type="text" ng-model="bar.baz"/></label>
        <hr/>
        <div ng-controller="ChildCtrl">
            <h2>Child</h2>
<label>Foo: <input type="text" ng-model="foo"/></label>
        -
        <label>Bar.baz: <input type="text" ng-model="bar.baz"/></label>
        </div>
    </div>
</div>

JavaScript

var app = angular.module("myApp", [])
.controller("ParentCtrl", function($scope) {
    $scope.foo = "Hello";
    $scope.bar = { baz: "Howdy" };
})
.controller("ChildCtrl", function($scope) {});