AngularJS Fade通过ng-bind-html更改了内容
美国广播公司
是否可以淡入所ng-bind-html填充元素的内容。已经尝试使用id.ng-enter或id.ng-leave不成功。
Chickenrice
ng-if将根据表达式的布尔值动态添加/删除DOM元素。可以将ng-animation附加到具有ng-if指令的元素，以更改DOM。
填写htmlContent时将添加此元素。
<body ng-controller="myCtrl">
<button ng-click="fillinContent()">fillin</button>
<div ng-if="htmlContent" class="toggle" ng-bind-html="htmlContent"></div>
</body>
声明CSS3过渡
<style>
.toggle{
-webkit-transition: linear 1s;
-moz-transition: linear 1s;
-ms-transition: linear 1s;
-o-transition: linear 1s;
transition: linear 1s;
}
.toggle.ng-enter{
opacity: 0;
}
.toggle.ng-enter-active{
opacity: 1;
}
.toggle.ng-leave{
opacity: 1;
}
.toggle.ng-leave-active{
opacity: 0;
}
</style>
控制者
angular.module("myApp",['ngSanitize','ngAnimate'])
.controller("myCtrl",function($scope){
$scope.fillinContent = function(){
$scope.htmlContent = "content content";
}
});
当您单击“填充”按钮时，html内容将淡出：
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
AngularJS Fade通过ng-bind-html更改了内容
- 2
AngularJS ng-bind-html-unsafe替换
- 3
ng-bind-html中的AngularJS指令
- 4
AngularJS中ng-bind，ng-bind-html，ng-bind-html-unsafe之间的区别？
- 5
AngularJS中ng-bind，ng-bind-html，ng-bind-html-unsafe之间的区别？
- 6
AngularJS：ng-bind-html内的tooltip-html-unsafe
- 7
内层HTML由angularjs中的ng-bind-html添加
- 8
如何使ng-bind-html编译angularjs代码
- 9
AngularJS为ng-bind-html设置样式
- 10
AngularJS ng-bind-html中带有变量
- 11
AngularJS ng-bind-html无法使用表达式
- 12
如何在AngularJS中使用ng-bind-html-unsafe？
- 13
angularjs和ng-bind-html无法正常工作
- 14
AngularJS ng-bind与函数
- 15
AngularJS ng-bind未更新
- 16
AngularJS在元素上嵌套ng-bind
- 17
html标签未在Angularjs中使用ng-bind-html显示
- 18
IE8 AngularJS页面加载滞后+ ng-bind-html问题
- 19
AngularJS：ng-bind-html不适用于按钮标签
- 20
AngularJS指令：具有范围值的模板（ng-bind-html）
- 21
使用AngularJS ng-bind-html从json数据获取img src
- 22
AngularJS-在ng-bind-html之后运行自定义指令
- 23
如何在angularJS中使用ng-bind-html指令绑定数组？
- 24
AngularJS使ng-bind-html成为动态构造的对象名称
- 25
如何使用 ng-bind-html 但禁用标签 <h1>, <b>... AngularJS
- 26
输入字段（type =“ number”）的内容更改后，将释放其angularjs的双向'BIND'属性。
- 27
AngularJS ng-bind到动态变量名
- 28
为什么AngularJS ng-bind不更新视图
- 29
AngularJS ng-bind需要显示变量+“ string”
我来说两句