AngularJS - how to wrap elements from a parent directive with elements of a child directive?

Question

JavaScript

It is necessary to implement a validator for the form
. I came across the following form structure in the code:

<my-form>
   <my-errors></my-errors>
   <my-input name="username" type="username" label="Имя" required></my-input>
   <my-input name="password" type="password" label="Пароль" required></my-input>
   <my-input name="phone" type="phone" label="Телефон"></my-input>
   <my-input name="email" type="email" label="Email"></my-input>
   <button class="btn btn-success btn-block">Отправить</button>
</my-form>

That is, the directives are nested directly into each other. As I understood from this, the tag <my-form>should display in the template <form>, which wraps the inputs, which are also output through their directives. And as I also understood, the inputs should, as it were, depend on the form, that is, they should not be displayed without it. The problem is that now they do not interact in any way. That is, the inputs live their own lives, and the form lives its own (its template is not even displayed in the DOM).
Now the directive for displaying the form looks like this:

// js/myForm.js
    'use strict';

(function (w) {
  angular.module('app', [])
  .directive('myForm', function () {
    return {
      restrict: 'E',
      transclude: true,
      scope: {},
      templateUrl: '/js/partials/myForm.html'
    }
  });
})(window);

To display the input, the directive looks like this:

// js/myInput.js

'use strict';

(function (w) {
  angular.module('app', [])
  .directive('myInput', function () {
    return {
      require: 'myForm',
      restrict: 'E',
      transclude: true,
      scope: {
        name: '@name',
        type: '@type',
        required: '@required',
        label: '@label',
      },
      templateUrl: '/js/partials/myInput.html'
    }
  });
})(window);

I tried to make the inputs child through require, but it's no use. In the DOM, inputs are still not displayed inside the tag <form>.
Maybe someone came across a similar investment? How can I organize the code so that everything is displayed correctly?
Entire project on GItHub:
https://github.com/ermolaevalexey/alfamotors-test-...

Answer 1

require: '^parent'
https://habrahabr.ru/post/232023/