在angular指令中传递ng-class条件

时间:2017-06-09 09:56:28

标签: angularjs angularjs-directive ng-class

我有一个指令:

angular.module("App").directive('myDirective', function () {
    return {
        restrict: "E",
        },            
        templateUrl: "MyDirective.html"
    }
});

模板:

<input Value = "Test" ng-class="{{ngclass}}"/>

HTML:

<my-Directive ng-class="{'ng-invalid': param === false }"/>

是否可以将ng-class条件传递给指令?

由于

2 个答案:

答案 0 :(得分:2)

您可以使用scope option,例如:

&#13;
&#13;
@Override
public void onTaskRemoved(Intent rootIntent){
    Intent restartServiceTask = new Intent(getApplicationContext(),this.getClass());
    restartServiceTask.setPackage(getPackageName());    
    PendingIntent restartPendingIntent = PendingIntent.getService(getApplicationContext(), 1,restartServiceTask, PendingIntent.FLAG_ONE_SHOT);
    AlarmManager myAlarmService = (AlarmManager) getApplicationContext().getSystemService(Context.ALARM_SERVICE);
    myAlarmService.set(
            AlarmManager.ELAPSED_REALTIME,
            SystemClock.elapsedRealtime() + 1000,
            restartPendingIntent
    );

    super.onTaskRemoved(rootIntent);
}
&#13;
    private static function getProductTaxRatesByTaxationRules($cartItem) {
        $shippingAddressData = self::$cart['ShippingAddress']['UserAddress'];
        $taxationRules = self::$cart['TaxationRules'];
        $currentUser = LoggedInUser::get();

        // Prepare data to compare with taxation rules
        $regularUser = false;
        if (!$currentUser['is_company']) {
            $regularUser = true;
        }
        $compareData = [
            'regular_user' => $regularUser,
            'company' => $currentUser['is_company'],
            'product_id' => $cartItem['product_id'],
            'subtype_id' => $cartItem['productIndex']['subtype_id'],
            'country_id' => $shippingAddressData['country_id'],
            'country_state_id' => $shippingAddressData['country_state_id']
        ];

        $taxRates = $cartItem['productIndex']['tax_rate'];

        foreach ($taxationRules as $taxRule) {
            $result = validateData($taxRule, $compareData);
            if ($result && !empty($taxRule['TaxationRule']['TaxationRuleCountryState'])) {
                $found = false;
                foreach ($taxRule['TaxationRule']['TaxationRuleCountryState'] as $countryStates) {
                    if (isset($countryStates['country_state_id']) && !is_null($countryStates['country_state_id'])) {
                        if ($countryStates['country_state_id'] == $compareData['country_state_id']) {
                            $found = true;
                        }
                    } else {
                        if ($countryStates['country_id'] == $compareData['country_id']) {
                            $found = true;
                        }
                    }
                }
                if (!$found) {
                    continue;
                }
            }
            // If any of flags aren't true, then add Taxation_rule_enabled_tax_rate and
            // check if there are enabled tax rates that needs to be added
            if (!empty($taxRule['TaxationRule']['Taxation_rule_enabled_tax_rate'])) {
                foreach ($taxRule['TaxationRule']['Taxation_rule_enabled_tax_rate'] as $includeTax) {
                    foreach ($taxRule['TaxRate'] as $taxData) {
                        if ($taxData['id'] == $includeTax) {
                            $taxRates[] = array(
                                'id' => $taxData['id'],
                                'value' => $taxData['taxrate']
                            );
                        }
                    }
                }
            }
        }

        foreach ($taxationRules as $taxRule) {
            $result = validateData($taxRule, $compareData);
            if ($result && !empty($taxRule['TaxationRule']['TaxationRuleCountryState'])) {
                $found = false;
                foreach ($taxRule['TaxationRule']['TaxationRuleCountryState'] as $countryStates) {
                    if (isset($countryStates['country_state_id']) && !is_null($countryStates['country_state_id'])) {
                        if ($countryStates['country_state_id'] == $compareData['country_state_id']) {
                            $found = true;
                        }
                    } else {
                        if ($countryStates['country_id'] == $compareData['country_id']) {
                            $found = true;
                        }
                    }
                }
                if (!$found) {
                    continue;
                }
            }

            // If any of flags aren't true, then remove Taxation_rule_disabled_tax_rate
            // Check if there are disabled tax rates that needed to be removed
            if (!empty($taxRule['TaxationRule']['Taxation_rule_disabled_tax_rate'])) {
                foreach ($taxRule['TaxationRule']['Taxation_rule_disabled_tax_rate'] as $excludeTaxId) {
                    foreach ($taxRates as $key => $value) {
                        if ($value['id'] == $excludeTaxId) {
                            unset($taxRates[$key]);
                            break;
                        }
                    }
                }
            }
        }

        return $taxRates;
    }

    private function validateData($taxRule, $compareData) {
        $result = false;
        if ($taxRule['TaxationRule']['user_type'] == 'regular' && !$compareData['regular_user']) {
            $result = true;
        }
        if ($taxRule['TaxationRule']['user_type'] == 'companies' && !$compareData['company']) {
            $result = true;
        }
        if (!empty($taxRule['TaxationRule']['Taxation_rule_product'])) {
            if (!in_array($compareData['product_id'], $taxRule['TaxationRule']['Taxation_rule_product'])) {
                $result = true;
            }
        }
        if (!empty($taxRule['TaxationRule']['Taxation_rule_product_subtype'])) {
            if (!in_array($compareData['subtype_id'], $taxRule['TaxationRule']['Taxation_rule_product_subtype'])) {
                $result = true;
            }
        }
        return $result;
    }
&#13;
angular.module('myApp', [])
.controller('MyCtrl', ['$scope', '$timeout', function MyCtrl($scope, $timeout) {
    var ctrl = this;
    
    ctrl.testTrue = true;
    ctrl.testFalse = false;
    
    $timeout(function(){
      ctrl.testFalse = true;
    }, 3000);
    
    return ctrl;
}])
.directive('myDirective', [function () {
        var myDirective = {
            restrict: 'E',
            scope: {
              ngClass: '='
            },
            template: "<input Value = 'Test' ng-class='ngClass'/>"
        }
        return myDirective;
}]);
&#13;
&#13;
&#13;

答案 1 :(得分:1)

我不确定你是否可以通过表达式传递范围变量......

angular.module("App").directive('myDirective', function () {
    return {
        restrict: "E",        
        templateUrl: "MyDirective.html",
        scope: { invalid: '=' }
    }
});

<my-Directive invalid="param === false"/>

<input Value="Test" ng-class="{'ng-invalid': invalid}"/>