Winkel -, ng-Nachrichten nicht zeigen, innen eckig-material-design-dialog (md-dialog)

Arbeite ich an einem Formular zum hinzufügen einer Kreditkarte in angularJS mit angular material (https://material.angularjs.org/latest/#/).

Für alle meine anderen Formulare, die ich verwendet, ng-Nachrichten (https://docs.angularjs.org/api/ngMessages/directive/ngMessages) zeigen Fehler bei der Validierung, und es funktionierte gut.

Wenn ich embded die form im inneren eine md-dialog, mein ng-Nachrichten werden nicht angezeigt, die Eingabe hinfällig geworden, aber kein Fehler angezeigt.
Ich habe das problem mit der grundlegenden überprüfung der Richtlinie und benutzerdefinierte Gültigkeitsprüfung-Richtlinie.

Meine Dialogfeld Vorlage :

<md-dialog>
<md-dialog-content style="max-width:800px;max-height:810px; ">
    <h2 i18n="add_card_button"></h2>
    <form name="form">
        <md-input-container>
            <label i18n="card_number"></label>
            <input  name="card_number"
                    type="text" 
                    ng-model="ctrl.newCard.cc_number"
                    class="md-input" 
                    required
                    card-number>
            <div ng-messages="form.card_number.$error">
                <div ng-message="cardNumber">test message</div>
                <div ng-message="required">test message 2</div>
            </div>
        </md-input-container>
        ...
    </form>
</md-dialog-content>
<div class="md-actions" layout="row">           
    <md-button ng-click="">
        <i18n>ok_button</i18n>
    </md-button>
    <md-button ng-click="cancel()" style="margin-right:20px;">
        <i18n>cancel_button</i18n>
    </md-button>
</div>

Mein dialog definition :

$mdDialog.show({
            controller : dialogController,
            controllerAs : "ctrl",
            bindToController : true,
            templateUrl : "creditCards/assets/templates/add_credit_card_dialog.html",
            parent : angular.element(document.body),
            targetEvent : event,
            clickOutsiteToClose : true,
            locals : {
                cardTypes : vm.cardTypes
            }
        });

und meine benutzerdefinierte Richtlinie definition

angular
    .module('app.core')
    .directive("cardNumber", cardNumber);

/* @ngInject */
function cardNumber () {
    var directive = {
        link: link,
        restrict: 'A',
        require : "ngModel"
    };
    return directive;

    function link(scope, element, attrs, ngModel) {
        ngModel.$validators.cardNumber = cardNumber;

        scope.$watch("cardNumber", function(){
            ngModel.$validate();
        });

        //Validate visa, mastercard, amex, concate new regex to validate more card
        var reg = new RegExp(/^(?:4[0-9]{12}(?:[0-9]{3})?|5[1-5][0-9]{14}|3[47][0-9]{13})$/);

        function cardNumber(modelValue){
            if(!modelValue){
                return true;
            }

            modelValue = modelValue
                            .replace(/-/g, "")
                            .replace(/\s/g, "")
                            .replace(/,/g, "");

            return reg.test(modelValue);
        }
    }
}

Und einen screenshot des Ergebnisses können Sie sehen, wo das ungültige Feld, aber keine Fehlermeldung :