如何在角度5 - 混合应用中使用angularjs控制器（angularjs和angular）

Question

我们的应用程序是用angularjs编写的，我们不会慢慢迁移到使用angular，因为我们已经在angularjs中有很多其他控制器和指令，我打算创建混合应用程序。

我正在尝试在角度组件中使用angularjs控制器，我该如何使其工作，

    <!--The content below is only a placeholder and can be replaced.-->
<div style="text-align:center" style="height: 800px;width: 800px;">
  <h1>
    Welcome to {{ title }}!
  </h1>
  <button (click)="addItem()">add item</button>
  <gridster [options]="options">
      <gridster-item [item]="item" *ngFor="let item of dashboard">
          <div (mousedown)="$event.stopPropagation()" (touchstart)="$event.stopPropagation()">
              Some content to click without dragging the widget
            </div>
            <div class="item-buttons">
              <button md-icon-button md-raised-button class="drag-handler">                  
                  <div style="width: 50px;height: 50px">open_with</div>
              </button>
              <button md-icon-button md-raised-button class="remove-button" (click)="removeItem($event, item)"
                      (touchstart)="removeItem($event, item)" mdTooltip="Remove">
                <div style="width: 50px;height: 50px">clear</div>
              </button>
            </div>
            <div ng-controller="myCtrl">
                First Name:
                <input type="text" ng-model="firstName">
                <br> Last Name:
                <input type="text" ng-model="lastName">
                <br>
                <br> Full Name: {{firstName + " " + lastName}}
              </div>
      </gridster-item>
    </gridster>
</div>

在上面的代码中，我添加了以下部分，它使用了angularjs控制器。但是我的应用程序无法正常工作，如果我并排使用，它就可以工作。

 <div ng-controller="myCtrl">
                First Name:
                <input type="text" ng-model="firstName">
                <br> Last Name:
                <input type="text" ng-model="lastName">
                <br>
                <br> Full Name: {{firstName + " " + lastName}}
              </div>