angular2中的ngShow和ngHide如何实现

前端之家收集整理的这篇文章主要介绍了angular2中的ngShow和ngHide如何实现前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

angular1中使用的ng-hide,在angular2中取消,使用属性[hidden]取代

<h3 ng-show="vm.favoriteHero">
  Your favorite hero is: {{vm.favoriteHero}}
</h3>

修改

<h3 [hidden]="favoriteHero">
  Your favorite hero is: {{favoriteHero}}
</h3>

ng-show则条件取反

<h3 [hidden]="!favoriteHero">
  Your favorite hero is: {{favoriteHero}}
</h3>

但在使用中发现,hidden属性优先级低于display,经常失效。解决办法是在style中加入,提高hidden属性的优先级。

[hidden] { display: none !important;}

参考资料:http://stackoverflow.com/questions/35578083/what-is-the-equivalent-of-ngshow-and-nghide-in-angular2

原文链接:https://www.f2er.com/angularjs/148153.html

猜你在找的Angularjs相关文章