How do I disable ngAria in ngMaterial?

后端 未结 5 1004
不知归路
不知归路 2021-01-07 17:43

ngAria (an accessibility module) is adding an unnecessary bower import to my Angular Material project - and now it is throwing warnings:

Attribute \"

相关标签:
5条回答
  • 2021-01-07 18:02

    ngAria, to my knowledge, cannot be disabled and should not be disabled it is core part of angular-material.
    enter image description here
    To disable warnings you can add aria-label="..." to the specific following items

    • input
    • md-button
    • md-dialog
    • md-icon
    • md-checkbox
    • md-radio-button
    • md-slider
    • md-switch

    I think, I have covered all of them, but there might be other so watch-out!


    0 讨论(0)
  • 2021-01-07 18:03

    I think Salal Aslam's answer is better, but if you want to disable the Aria warnings temporarily you could just do a tweak on the console.warn override you suggested in the original question. Something like this perhaps:

    console.realWarn = console.warn;
    console.warn = function (message) {
        if (message.indexOf("ARIA") == -1) {
            console.realWarn.apply(console, arguments);
        }
    };
    

    Edit: for complex situations, more elaborate solutions may be required. Check out Shaun Scovil's Angular Quiet Console

    0 讨论(0)
  • 2021-01-07 18:03

    Just add another tag aria-label="WriteHereAnyLabelYouLike" on md-checkbox and it will resolve the issue.

    <md-checkbox type="checkbox" ng-model="account.accountant" class="md-primary" layout-align="end" ng-true-value="1" ng-false-value="0" aria-label="ShowHideAccountant" ></md-checkbox>
    

    aria-label="WriteHereAnyLabelYouLike"

    0 讨论(0)
  • 2021-01-07 18:21

    If you really want to disable it, you can by simply overwriting or as angular calls it decorating the original mdAria service that's located inside the angular-material library.

    angular.module('appname').decorator('$mdAria', function mdAriaDecorator($delegate) {
        $delegate.expect = angular.noop;
        $delegate.expectAsync = angular.noop;
        $delegate.expectWithText = angular.noop;
        return $delegate;
    });
    

    This is working in angular-material v1.0.6 but you may have to check that all methods have been cleared.

    Basically all the above does is replace the public methods exposed to the $mdAria service and it will replace those methods with a noop (no operation).

    0 讨论(0)
  • 2021-01-07 18:28

    Disabling messages globally is possible as of 1.1.0:

    app.config(function($mdAriaProvider) {
       // Globally disables all ARIA warnings.
       $mdAriaProvider.disableWarnings();
    });
    

    (But do note the discussion in other answers about aria labels being important for accessibility!)

    0 讨论(0)
提交回复
热议问题