Question

我想使用ng-repeat在div中创建一行按钮。然后以某种方式克隆/复制该div。

基本上它看起来像这样;

[0] [0] [0] [0]

我还想制作下面重复的div。我之前使用过克隆，但是我需要使用ng-repeat而不是那么成功。

<body ng-app="myApp" ng-controller="myCtrl">
...
...
...
<div id="boxHolder">
<span id="musicBox" ng-repeat="x in instrumentBtns">
{{x}}
</span>
</div>

这就是我对html的看法。到目前为止，我的app.js文件看起来像这样。

var app = angular.module("myApp", []);

app.controller("myCtrl", function($scope) {
  $scope.instrumentBtns = [
    '<button id="inst0">0</button>',
    '<button id="inst1">0</button>',
    '<button id="inst2">0</button>',
    '<button id="inst3">0</button>',
  ]
});

首先发布到StackOverflow，所以如果我不清楚请告诉我！谢谢！

Answer 1

使用ngSanitize

angular.module('sanitizeExample', ['ngSanitize'])
           .controller('ExampleController', ['$scope', '$sce', function($scope, $sce) {
  $scope.htmlTrusted = function(html) {
    return $sce.trustAsHtml(html);
  }
}]);

<span id="musicBox" ng-repeat="x in instrumentBtns">
  <div ng-bind-html="htmlTrusted(x)"></div>
</span>

如何在AngularJS中使用ng-repeat插入html代码？

1 个答案: