Angularjs 当用户单击事件时返回模板

我正在尝试摸索angular的语法（昨天刚刚开始），以及实现以下目标的最佳方法。我想做的是加载一些已编译的html并将其注入DOM。这是对以下问题的跟进：。而不是打电话

<div my-customer></div>

我想根据用户交互动态加载模板。比如说：

<div ng-click="loadMyCustomer()">load customer</div><!-- should load here -->
....

arcModule.controller('MainCtrl', function($scope, $http){
  $scope.sayHello(){
    alert("hello here");
  }

  $scope.loadMyCustomer=function(){
    //alert("hello");
    // return the template in the mycustomer directive and place it after the current DOM element from which it is called 
  }
  $scope.customer = {
    name: 'Naomi',
    address: '1600 Amphitheatre'
  };
});

arcModule.directive('myCustomer', function() {
  return {
    template: 'Name: {{customer.name}}<button ng-click="sayHello()">Click to say hello.</button> Address: {{customer.address}}'
  };
});

加载客户
....
控制器（'MainCtrl'，函数（$scope，$http）{
$scope.sayHello（）{
警报（“您好”）；
}
$scope.loadMyCustomer=function（）{
//警惕（“你好”）；
//在mycustomer指令中返回模板，并将其放在调用该模板的当前DOM元素之后
}
$scope.customer={
名字：“娜奥米”，
地址：“1600圆形剧场”
};
});
指令（'myCustomer'，函数（）{
返回{
模板：“名称：{{customer.Name}}单击以打招呼。地址：{{customer.Address}”
};
});

---

对不起，如果这听起来很简单，但我发现角度文档有点不透明，如果我能想出如何返回这个，我将非常高兴。那么，如何通过loadMyCustomer方法返回指令中的模板呢？

对于您突出显示的内容，无需创建新指令和使用当前的

ng include

指令即可完成

即使你必须这样做

<div ng-click="showCustomer=true">...
<div my-customer ng-if="showCustomer"></div>

。。。

ngif

的优点是在

showCustomer

为真之前不会加载模板