Javascript 角度-用于ng隐藏和ng显示的事件

我想在我的应用程序中的所有元素上观看隐藏和显示表达式

我知道我可以用一个只返回参数的函数包装show指令：

<div ng-show="catchShow(myShowExpr == 42)"></div>

虽然那时我不能使用谷歌CDN

---

有没有比这更好的方法呢？

以下是我的想法（咖啡脚本）

已转换为JavaScript:

var getDirective = function(isHide) {

  return ['$animator', function($animator) {
    //linker function
    return function(scope, element, attr) {

      var animate, last;
      animate = $animator(scope, attr);
      last = null;

      return scope.$watch(attr.oaShow, function(value) {
        var action;
        if (isHide)
          value = !value;

        action = value ? "show" : "hide";

        if (action !== last) {
          scope.$emit('elementVisibility', {
            element: element,
            action: action
          });
          animate[action](element);
        }

        return last = action;
      });
    };
  }];
};

App.directive('oaShow', getDirective(false));
App.directive('oaHide', getDirective(true));

---

另一种方法是

$watch

使用

ngShow

的属性，尽管这需要在指令中完成（如果您正在显示/隐藏一个已经自定义的指令，这很有用）

---

您可以编写自己的显示指令而不是使用

ng show

我可以问一下这里的业务需求吗？我在想是否有更好的方法来实现这一点。我有一个复杂的表单，当一个元素被隐藏时，它需要被清除。目前，我正在自己的幻灯片中进行此操作。虽然如果我决定淡出一个元素，或者立即隐藏/显示，它很快就会变得非常粗糙。因此需要举办一次活动。由于

ng show

指令的实现相当简单，我可能会按照@charlietfl的建议执行我自己的指令。。。发帖前先看一下账目。问题中添加了“Coffeescript”标签。在回答问题时投反对票。：）否决票赞成在答案中加入咖啡脚本？欧威尔。憎恨者会讨厌的。因为说真的，这家伙回答了他自己的问题，这是一个完全有效的答案，撇开语言圣战不谈。一般来说，问题作者发布的答案并不一定会使答案有效，这个地方应该是其他用户的记录，所以答案真的应该与问题相符。现在有，但你知道，供将来参考。

getDirective = (isHide) ->
  ['$animator', ($animator) ->
    (scope, element, attr) ->
      animate = $animator(scope, attr)
      last = null
      scope.$watch attr.oaShow, (value) ->
        value = not value if isHide
        action = if value then "show" else "hide"
        if action isnt last
          scope.$emit 'elementVisibility', { element, action }
          animate[action] element
        last = action
  ]

App.directive 'oaShow', getDirective(false)
App.directive 'oaHide', getDirective(true)

var getDirective = function(isHide) {

  return ['$animator', function($animator) {
    //linker function
    return function(scope, element, attr) {

      var animate, last;
      animate = $animator(scope, attr);
      last = null;

      return scope.$watch(attr.oaShow, function(value) {
        var action;
        if (isHide)
          value = !value;

        action = value ? "show" : "hide";

        if (action !== last) {
          scope.$emit('elementVisibility', {
            element: element,
            action: action
          });
          animate[action](element);
        }

        return last = action;
      });
    };
  }];
};

App.directive('oaShow', getDirective(false));
App.directive('oaHide', getDirective(true));

scope.$watch attrs.ngShow, (shown) ->
  if shown
    # Do something if we're displaying
  else
    # Do something else if we're hiding