Question

我们在角度js中使用ng-bind指令创建了div。我们无法将样式属性应用于同一个div

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

在控制器文件中我将测试变量定义为

$scope.test="<div style="background:red;"></div>

我们需要应用style属性。使用CSS属性，我能够做到。但每次需要更改背景时。

Answer 1

我不知道你想要什么，但你的代码唯一不对的是你没有ng-bind-html-unsafe ...假设你正在使用一个版本的角度＆lt; 1.2。

ng-bind-html通过$sanitize服务运行代码，该服务检查不安全的代码。在你的例子中我和＆＃34;风格＆＃34;将被剥夺。不安全的版本不会执行此检查，因此如果您在某些情况下使用它而无法完全控制（例如WYSIWYG编辑器保存到您的数据库并显示注释）。您可以让那些混乱的数据运行恶意脚本。

示例小提琴：http://jsfiddle.net/pW7WY/

支持代码。

<div ng-app>
    <div ng-controller="Ctrl">
       <div id="nick" ng-bind-html-unsafe="test"></div>
    </div>
</div>


--js
function Ctrl($scope) {
   $scope.test='<div id="child" style="background:red;"></div>'
}

--css
#nick{
    width: 300px;
    height: 300px;
}
#child{
    width: 200px;
    height: 200px;      
}

Answer 2

我不知道你想要什么，但你的代码唯一不对的是你没有ng-bind-html-unsafe ...假设你正在使用一个版本的角度＆lt; 1.2。

ng-bind-html通过$sanitize服务运行代码，该服务检查不安全的代码。在你的例子中我和＆＃34;风格＆＃34;将被剥夺。不安全的版本不会执行此检查，因此如果您在某些情况下使用它而无法完全控制（例如WYSIWYG编辑器保存到您的数据库并显示注释）。您可以让那些混乱的数据运行恶意脚本。

示例小提琴：http://jsfiddle.net/pW7WY/

支持代码。

<div ng-app>
    <div ng-controller="Ctrl">
       <div id="nick" ng-bind-html-unsafe="test"></div>
    </div>
</div>


--js
function Ctrl($scope) {
   $scope.test='<div id="child" style="background:red;"></div>'
}

--css
#nick{
    width: 300px;
    height: 300px;
}
#child{
    width: 200px;
    height: 200px;      
}

将style属性应用于angular js中的ng-bind指令

2 个答案: