JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="MyApp">
    <div ng-controller="ParentController">
        <h3>Parent Section: {{name}}</h3><br/>
        <button ng-click="parentChangeName()">parentChangeName</button>
        <div ng-controller="ChildController">
            <h3>Child Section: {{name}}</h3><br/>
            <button ng-click="childChangeName()">childChangeName</button>
        </div>
    </div>
</div>

JavaScript

angular.module("MyApp", [])
.controller("ParentController", function($scope){
    $scope.name = "dreamapple";
    $scope.parentChangeName = function(){
        $scope.name = "parent dreamapple";
    }
})
.controller("ChildController", function($scope){
    $scope.childChangeName = function(){
        $scope.name = "child dreamapple";
    }
});