Jquery 创建动态div

我已经使用jquery在数组值的基础上创建了动态div。它工作正常，以下是jquery的代码

$(document).ready(function () {
    var i = 1;
    var arr = ["a", "b", "c"];
    /*arr=;*/
    //arr = doc.slice();

    $(window).load(function () {
        alert(arr[1] + ":" + arr.length);
        for (i = 0; i < arr.length; i++) {
            var ele = document.createElement("div");
            ele.setAttribute("id", "child" + i);
            ele.setAttribute("class", "span4 greenDark");
            ele.innerHTML = '<object type="text/html" data="iindex.html" ></object>';
            document.getElementById("mydiv").appendChild(ele);
        }
    });
});

$（文档）.ready（函数（）{
var i=1；
var arr=[“a”、“b”、“c”]；
/*arr=*/
//arr=doc.slice（）；
$（窗口）。加载（函数（）{
警报（arr[1]+“：”+arr.length）；
对于（i=0；i

但我需要在angular js ng init方法调用中执行相同的函数。但是角度代码没有创建任何div。 我尝试了以下代码

var arr = ["a", "b", "c"];
alert("load" + arr);

for (i = 0; i < arr.length; i++) {
    alert("load" + arr[i]);
    var ele = document.createElement("div");
    ele.setAttribute("id", "child" + i);
    ele.setAttribute("class", "span4 greenDark");
    ele.innerHTML = '<object type="text/html" data="iindex.html" ></object>';

    // angular.element(document.getElementById("mydiv").appendChild(ele));
    angular.element(document.getElementById('mydiv')).append($compile("<div><button class='btn btn-default' data-alert=" + scope.count + ">Show alert #" + scope.count + "</button></div>")(scope));
}

var arr=[“a”、“b”、“c”]；
警报（“加载”+arr）；
对于（i=0；i

---

我需要帮助。

控制器

：

创建一个函数以返回此HTML：

function initButton () {

  var arr = ['a', 'b', 'c'];
  var html = '';

  for (var i = 0, length = arr.length; i < length; i++) {
    html += "<div><button class='btn btn-default' data-alert=" + i + ">Show alert #" +i"</button></div>";
  }

  return html; 

}


$scope.buttonHTML = initButton();

angular.module（'sampleApp'，[]）
.controller（'myCtrl'，函数（$scope）{
$scope.myarray=[“a”、“b”、“c”]；
})
.directive（“myDirective”，函数（$compile）{
返回{
模板：“”，
限制：“EA”，
范围：{
myarray:“=”
},
链接：函数（作用域、元素、属性）{
var template='item#{{$index}}'；
var linkFn=$compile（模板）；
var内容=linkFn（范围）；
元素。追加（内容）；
}
}
});

---

签出小提琴

为此编写指令如何为此功能编写指令。？记住包括角度消毒。

<div ng-bind-html="buttonHTML"></div>

<div my-directive myarray="myarray"></div>



  angular.module('sampleApp', [])
  .controller('myCtrl', function($scope) {
    $scope.myarray = ["a","b","c"];
  })
  .directive("myDirective", function($compile) {
    return {
      template: "<div></div>",
      restrict: 'EA',
      scope: {
        myarray: '='
      },
      link: function(scope, element, attrs) {  
         var template='<div ng-repeat="item in myarray"><button class="btn btn-default" >item#{{$index}}</button></div>';

            var linkFn = $compile(template);
            var content = linkFn(scope);
            element.append(content);
      }

    }
  });