如何使用 angular 将字符串值转换为 html 元素？

Question

我尝试通过 angular HTTP 调用将一页 html 绑定到模型 window 并且 ng-bind-html 标签还包含 ngSanitize js核心。但它在没有 HTML 元素的情况下工作。
我的代码：HTML

<div class="myModels" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="false" data-backdrop="true" ng-show="showModel">
    <div class="modal-dialog" role="document" ng-bind-html = "ModelContent"></div>
</div>

控制器

$scope.Login = function(path){
    $http.post('http:'+path).success(function(result){$scope.ModelContent = result;})
}

渲染 HTML:

<div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close" ng-model="">
                <span aria-hidden="true">&times;</span>
                <span class="sr-only">Close</span>
            </button>
            <h4 class="modal-title" id="myModalLabel">Login</h4>
        </div>
        <div class="modal-body">
            <div class="row">
                <div class="col-md-10">
                    <label>User Name</label>
                    <input type="text" name="username" maxlength="10" class="form-control" ng-model=""> 
                </div>
            </div>
            <div class="row">
                <div class="col-md-10">
                    <label>Password</label>
                    <input type="password" name="password" maxlength="15" class="form-control" ng-model=""> 
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button name="SignIn" class="btn btn-success pull-right">Log in</button>
        </div>
    </div>

You can refer below image it doesn't showing HTML elements

Answer 1

将此代码放入您的控制器中 controller.js

$rootScope.errorMessage = 'Account activated successfully, please <a href="/">Login</a> and other <em>stuff</em> with your username and password';

也可以在您的 html 页面中使用此代码

<h5 ng-bind-html="errorMessage"></h5>

Answer 2

通过快速查看 the $sanitize whitelist 的源代码，似乎默认情况下不允许 input 个元素。

您可以将它们添加到白名单，但在这种情况下 HTML 来自您的服务器，我希望它是值得信赖的。因此，最简单的解决方案是 use $sce.trustAsHtml 允许 HTML.

中的所有元素

为此，您需要像这样更改 Login 函数：

// Note that you'll need to inject $sce into your controller
$scope.Login = function(path){
    $http.post('http:'+path)
    .success(function(result) {
        $scope.ModelContent = $sce.trustAsHtml(result);
    });
}

如何使用 angular 将字符串值转换为 html 元素？

how to convert string value to html element using angular?

angularjs

ng-bind-html

ng-bind