AngularJS：当元素太大时如何隐藏它？

【问题标题】：AngularJS: How to hide an element when it's too big?AngularJS：当元素太大时如何隐藏它？
【发布时间】：2012-11-28 22:13:48
【问题描述】：

http://plnkr.co/edit/roJC9X

请参阅上面的链接。当文本区域的宽度超过 400 像素时，我想隐藏文本区域。如何做到这一点？

【问题讨论】：

你的意思是，当浏览器宽度超过 400px 时，你想隐藏文本区域？
不我想隐藏 textarea 本身 > 400px
所以你需要监听textarea的resize事件吗？ stackoverflow.com/questions/5570390/resize-event-for-textarea

标签： angularjs

【解决方案1】：

当您使用 Angular 并处理与视图相关的代码时，您需要定义一个 directive。

下面的代码是该指令的示例（用 CoffeeScript 编写）：

angular.module('yourAppName').directive('hideOnExceed', ->
  return {
    restrict: 'A', 
    link: (scope, element, attr) ->
      element.bind 'resize', ->
        if element.width() > 400
          element.hide()
        else
          element.show()
  }
)

然后简单地将hideOnExceed定义为textarea标签的属性：

<textarea ng-show="withinSize()" hideOnExceed>{{size}}</textarea>

【讨论】：