如果父标记包含ng-bind-html指令，则html标记不起作用

下面是我的代码示例，如果我删除了ng-bind-html，那么div正在工作，如果没有失败，请建议我一个答案

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular-sanitize.js"></script>
<script>
    var app = angular.module('myApp', ['ngSanitize']);
app.controller('CartController', function($scope) {
                $scope.title = "<p>hello world</p>";
            $scope.test = "How are you..!How are you..!How are you..!";
        });
  </script>
<body ng-app="myApp" >
    <div ng-controller="CartController">
    <label ng-bind-html=title> 
        <div>{{test}}</div>
    </label>
    </div>
</body>
</html>

您需要使用$sce.trustAsHtml将$sce注入控制器：

JSFiddle

app.controller('CartController', function($scope, $sce) {
    $scope.title = $sce.trustAsHtml("<p>hello world</p>");
    $scope.test = "How are you..!How are you..!How are you..!";
});

当然，HTML label将被$scope.title完全取代，您将无法再看到{{test}}

当您使用ng-bind-html到<label>时，它完全被$scope变量取代，因此如果标签包含ng-bind-html指令，则您无法在<label>标签内实现<div>

<label ng-bind-html='<p>hello world</p>'> Label1 <div>text1</div> </label>

在上面的Html中，只有Html"hello world"将与text1一起显示，无论如何，除非需要..，否则这是不可取的。。！

相关内容

最新更新

热门标签：