https://news.angularjobs.com/jquery-to-angularjs/

jquery-to-angularjs-14.js

var app = angular.module('myApp', []);
app.controller('accountsSummaryCtrl', function ($scope) {
  $scope.assetsAccount = {
    name: 'Assets',
    balance: 4324.00,
    subAccounts: [{
      name: 'Bank Account',
      balance: 2000
    }, {
      name: 'Cash',
      balance: 2324.00
    }]
  };
  $scope.receivablesAccount = {
    name: 'Receivables',
    balance: 132.00,
    subAccounts: [{
      name: 'Customer A',
      balance: 32.00
    }, {
      name: 'Customer B',
      balance: 100.00
    }]
  };
  $scope.debtsAccount = {
    name: 'Debts',
    balance: 0,
    subAccounts: [{
      name: 'Collector A',
      balance: 50
    }, {
      name: 'Supplier B',
      balance: -50.00
    }]
  };
  $scope.equityAccount = {
    name: 'Equity',
    balance: 4459,
    subAccounts: [{
      name: 'Bank Account',
      balance: 3000
    }, {
      name: 'Customer C',
      balance: 1459
    }]
  }
});

app.directive('account', function () {
  return {
    restrict: 'E',
    scope: {
      account: '=name'
    },
    template: $('#account-template').html(),
    controller: function ($scope, $element, $attrs) {
      $scope.subAccountsOpen = false;
      $scope.toggleSubAccounts = function () {
        $scope.subAccountsOpen = !$scope.subAccountsOpen;
      }
    }
  }
});