在angularjs中动态插入外部模板

Question

我有一个Angular内置的联系人列表，我需要创建一个“添加活动”功能。

为此，我希望能够将具有自己的控制器的外部HTML模板动态插入到现有模板中。

目前的HTML如下：

<table style="width:100%">
  <tr ng-repeat="Contact in Contacts | orderBy: 'LastName'">
    <td> {{ Contact.FirstName }} {{ Contact.LastName }} </td>
    <td>Add Activity</td>
  </tr>
</table>

我想点击添加活动，并将Angular从外部模板插入HTML到所点击行下面的新行。

这可能吗？