JSFiddle - React, Tailwind, and code Playground

by hbulhoes

HTML

<div ng-app>

<div ng-controller="PaiController" class="box">
    <p><b>PAI:</b> Eu possuo $ <input type="number" ng-model="DinheiroDoPai" />.</p>
    
    <div ng-controller="FilhoController" class="box">
        <p><b>FILHO:</b> E eu possuo $ <input type="number" ng-model="DinheiroDoFilho" />.</p>
        <p>Mas com a herança eu possuo de fato ${{ DinheiroDoFilho + DinheiroDoPai }}.</p>
    </div>
</div>

</div>

CSS

.box
{
    border: 1px solid gray;
    margin: 1em;
}

JavaScript

function PaiController($scope)
{
    $scope.DinheiroDoPai = 100;
}

function FilhoController($scope)
{
    $scope.DinheiroDoFilho = 50;
}