Angularjs 使用ng click动态添加指令

我正在为客户开发一个模式。我已经创建了一个非常有效的指令，问题是每次使用它时，都会提前生成一个模式，如

我拥有的

<div ng-repeat="item in items">
  <a data-toggle="modal" data-target="{{item.id}}">Click</a>
  <my-dialog element-id="item.id">
    <h1>This is the body of the modal</h1>
  </my-dialog>
</div>

点击
这是模态分析的主体

这对于少量模态非常有效，但是我们使用了大量模态。所以我想在运行时添加指令，更接近

我想要什么…

<div id="warning"></div>
<div ng-repeat="item in items">
  <a data-toggle="modal" data-target="{{item.id}}" ng-click="showModal(item)">Click</a>
</div>
...
// inside controller
$scope.showModal = function(item){
  $http.get('/someUrl').success(function(data){
    var result = $compile('<my-dialog element-id="'+item.id+'">'+data+'</my-dialog>').($scope);
    $("#warning").append(result);
  });
}
$scope.hideModal = function(){
  $( "#warning" ).empty();
}

点击
...
//内部控制器
$scope.showmodel=功能（项目）{
$http.get（'/someUrl'）.success（函数（数据）{
变量结果=$compile（“”+data+“”）。（$scope）；
$（“#警告”）。追加（结果）；
});
}
$scope.hideModal=函数（）{
$（“#警告”）.empty（）；
}

这当然还不起作用。而且这也不是最好的方式。这将允许我在指令关闭后删除它

请在支票中附上plunker或同等物品

试试这个：

 var result = $compile('<my-dialog element-id="'+item.id+'">'+data+'</my-dialog>')($scope);

var result=$compile（“”+data+“”）（$scope）；

一种方法是对项目使用ng repeat，然后在将新项目推送到列表后调用$scope.$apply（）。HTML可能看起来像这样

<div ng-repeat="item in items">
  <span dialog>
    <a class="dialog-anchor">{{item.name}}</a>
    <div class="dialog-body">{{item.id}}</div>
  </span>
</div>

。。。控制器是这样的

.directive('dialog', [function () {
    return {
    scope: {
    id: '@elementId',
  }
  , link: function (scope, el, attrs) {
    var body = $(el).find('.dialog-body').detach();
    $(el).find('.dialog-anchor').on('click', function () {
      $('body').append(body);
    });
  }};
  }])

.controller('app', ['$scope', function ($scope) {
  $scope.items = [
    {name: 'first', id: 001},
    {name: 'second', id: 002}
  ];

  setTimeout(function () {
    $scope.items.push({name: 'three', id: 003});
    if (!$scope.$$phase) $scope.$apply();
  }, 2000);  
}])

---

这是普朗克。您可以在setTimeout中看到$scope.$apply调用，我将一个新项目推送到数组中。

您在控制台中看到任何错误吗？这里似乎是语法错误

$compile（''+data+''）（$scope）对，这是问题的一部分，我不知道从哪里获得它。它必须是数据。数据。。。在您的指令中执行控制台数据日志和注入$compile编译从何而来？你能给我看一个扑克牌吗？