JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.0/angular.min.js"></script>
<div id="demo.module.mBoard" ng-controller="mBoardCtrl as $ctrl">
  <widget item="$ctrl.item"></widget>
</div>

JavaScript

angular
	.module('mBoard', [])
	.component('widget', {
  	template: '<h2>{{$ctrl.item}}</h2>',
    bindings: {
      item: '<'
    },
    controller: function () {
      var ctrl = this;

      ctrl.$onInit = function() {
        alert(ctrl.item);
      };
    
    }
  })
	.controller('mBoardCtrl', function mBoardCtrl() {
		this.item = 'Hello Valeriy Donika';
	})
;


/* https://docs.angularjs.org/guide/bootstrap */
angular.bootstrap(document.getElementById("demo.module.mBoard"), ['mBoard']);