在AngularJS中如何动态创建新的ngController？

Question

我正在尝试动态创建新的ngController ，这可能吗？ 我不会使用ngRepeat或其他任何东西将其写入模板，因为用户可能永远不会创建某个ngController的实例。

这是我当前模板的示例：

<div ng-controller="ViewUsers">
   <div class="viewUsersList">
      <table>
         <tr class="userRow" ng-click="viewUser(user.user_id)" ng-repeat="user in users">
            <td>{{user.first_name}} {{user.last_name}}
                <br />{{user.phone}}
            </td>
         </tr>
      </table>
    </div>
 </div>

到目前为止，效果很好。 当用户单击.userRow它将调用viewUser(ID) 。 问题在这里：

我想创建一个新的代码块，如下所示：

<div ng-controller="UserDetail">
   {{first_name}}
</div>

并将其附加到DOM。

因此，如果他们单击Bobby和Sally ，则会将两个UserDetail控制器对象添加到DOM并相应地工作。 （理想情况下，我想传递数据绑定的user模型，但这供以后使用）。

我在JSBin中尝试了贫民窟版本，但如果可能，我宁愿不使用JQuery：

http://jsbin.com/EdOteTav/2/edit

谁能对此有所启发？ 提前致谢

Answer 1

我会稍微更改代码，并使用指令代替控制器。 请参阅jsfiddle中的这个简单快速的示例。

该指令将处理单击事件并显示要在DOM上显示的任何内容。 您可以从scope.user内的scope.user获取完整的用户对象。