javascript - AngularJS:ng-bind-html 不适用于按钮标签

Question

我在 div“ng-bind-html”中动态打印输入类型按钮时遇到问题。

HTML 模板:

<input type="button" value="Add" ng-click="add()">
<div ng-bind-html="snippet"></div>

Controller :

$scope.add = function() {
   $scope.snippet = "<input type='button' value='Test' ng-click='myFunc()'><b>Test 2</b>";
}

标签输入被删除，然后我只看到“粗体”文本测试 2。

谢谢

Answer 1

由于某些原因，您的 html 标记被 Angular js 标记为 unsafe。如果您确定您的片段文本是安全的，您可以在将其添加到 $scope.snippet 之前将其$sce.trustAsHtml。

app.controller('yourCtrl', ['$scope', '$sce', function($scope, $sce){
    $scope.add = function(){
        var text = "<input type='button' value='Test'><b>Test 2</b>";

        // mark it as clean
        text = $sce.trustAsHtml(text);

        $scope.snippet = text;
    };
}]);