Edit in JSFiddle

angular
	.module('app', [])
  .component('parentComponent', {
  	transclude: true,
    template: '<div ng-transclude></div>'
  })
	.component('childComponent', {
  	bindings: {
      count: '='
    },
    controller: function () {
    	this.state = 'Not loaded';
      this.$onInit = function() {
      	this.state = 'Loaded!';
      };
    },
    template: [
      '<div>',
        'Component: {{ $ctrl.state }}',
      '</div>'
    ].join('')
  });

document.addEventListener('DOMContentLoaded', function () {
	angular.bootstrap(document, ['app']);
});
<div>
    <parent-component>
      <child-component></child-component>
    </parent-component>
</div>