Question

我想制定一个修改ngShow或ngHide是否在元素上的指令。

这是我到目前为止所拥有的。一个简单的指令，用于侦听根作用域上的消息并修改元素的显示样式。虽然这确实有效，但如果我使用ngAnimate在元素隐藏时应用淡出，我想将ngShow / ngHide应用于该元素。

HTML

<div id='myElement' my-directive/>

的JavaScript

require('angular')
    .module('app')
    .directive('myDirective', myDirective);

/* @ngInject */
function progressListener($rootScope) {
    return {
        restrict: 'A',
        scope: {
        },
        link: function(scope, element, attrs) {
            $rootScope.$on('loading', function() {
                element[0].style.display = '';
            });
            $rootScope.$on('complete', function() {
                element[0].style.display = 'none';
            });
        }
    };
}

如何在指令的元素上切换ngShow / ngHide？

Answer 1

您必须将其包含在您的隔离范围内

<div id='myElement' my-directive ng-show="show"/>

链接中的

       scope: {
        show : false // set what must be default
        },
        link: function(scope, element, attrs) {
            $rootScope.$on('loading', function() {
                scope.show = true;
            });
            $rootScope.$on('complete', function() {
                 scope.show = false;
            });
        }

通过指令切换元素上的显示

1 个答案: