JSFiddle - React, Tailwind, and code Playground

HTML

<div id="app">
  <div ng-controller="ControllerOne">{{value}}</div>
  <div ng-controller="ControllerTwo">{{value}}</div>
</div>

JavaScript

var app = angular
    .module("app", [])
    .factory("myapi", function() {
      var api = {
        foo: function (bar) {
          return bar + "_baz"
        }
      };
      //now api is exposed to whoever injects myapi
      return api;
    })
    .controller("ControllerOne", function($scope, myapi) {
      $scope.value = myapi.foo("one");
    })
    .controller("ControllerTwo", function($scope, myapi) {
      $scope.value = myapi.foo("two");
    });
    
angular.element(document).ready(function () {
  var app = document.getElementById("app")
  angular.bootstrap(app, ["app"]);
});