Question

我试图限制ng-hide / ng-show的调用。目前，它的作用是多次调用getLicense函数，这会使浏览器超载。

$scope.getLicense = function( value ) {

    if( $sessionStorage.license === '' ) {
        DashboardService.getLicense( ).then( function( data ) {
            $scope.licenses = data;
            var arr = [ ],
                id = '';
            for( var i in $scope.licenses ) {
                arr.push( [ i ] );
            }
            $sessionStorage.license = arr;
        } );

        for( var cnt = 0; cnt < $sessionStorage.license.length; cnt++ ) {
            if( $sessionStorage.license[ cnt ] == value ) {
                console.log( 'true' );
                return true;
                break;
            } else {
                return false;
                break;
            }
        }
    } else {
            for( var cnt = 0; cnt < $sessionStorage.license.length; cnt++ ) {
            if( $sessionStorage.license[ cnt ] == value ) {
                console.log('true');
            return true;
                break;
            } else {
                console.log('false');
                return false;
                break;
            }
        }

    }

};

我的HTML代码如下所示：

   <md-list-item class="md-caption" ng-class="{'active': $state.includes('security.webcontrol')}" translate="SIDEBAR.NAV.WEBCONTROL.TITLE"  ng-hide="getLicense('web_control_da')">

Answer 1

向ng-show / hide / if /等提供功能是一种非常糟糕的做法。

每次调用$digest（经常）时，都会检查每个观察者是否已更改。所以它必须执行你的函数来知道结果是否不同（。或者不是）。

在您的函数console.log('function executed')中添加getLicense，您将看到它被调用的频率。

为避免这种情况（如 Icycool 所解释），您必须在范围内用布尔值替换它。并且只在应该测试getLicense时更改布尔值。

例如：如果每次getLicense更改时都需要计算$sessionStorage.license :(例如）：

$scope.licence = getLicense();

$scope.watch("$sessionStorage.license", function (newValue, oldValue){
    $scope.licence = getLicense();
});

在您的视图/模板中：ng-hide="licence"

因此只有在真正重要时才会执行getLicense。

Answer 2

您可以将其分配给范围变量，并让ng-hide指向该变量。在其他场合打电话检查牌照。

ng-show / ng-hide限制多次通话

2 个答案: