Nutzungsrichtlinie mit erforderlicher^Form in einem Winkelmaterial md-Dialog

Question

Plunker verfügbar here

I eine Richtlinie (erste Richtlinie im Beispiel) mit einer erforderlichen ^form in einem Winkel einschließen mögen -Material MD-Dialog. Wenn der Dialog angezeigt wird, gibt es einen Fehler bei der Form sagen, kann nicht gefunden werden:

[$compile:ctreq] Controller 'form', required by directive 'first', can't be found! 

ich require:^form bin mit, weil ich mit ng-messages einigen Bereichen der Mutterform innerhalb der Richtlinie überprüfen möchten. Die Direktive außerhalb des Dialogs funktioniert wie erwartet und die Formulareingabe wird korrekt validiert. Das Problem tritt nur auf, wenn ich die Direktive im Dialog verwende.

Ich habe versucht, eine andere Richtlinie (Sekunden Richtlinie im Beispiel) zu schließen, ohne require:^form, und es ist richtig im Dialog angezeigt, aber in diesem Fall die Eingabe nicht validiert werden kann.

Meine Frage ist: Gibt es eine Möglichkeit, eine Direktive mit "Formular erforderlich" in einem MD-Dialog zu verwenden, wenn das Formular außerhalb des Dialogs definiert ist?

Ich nehme an, es liegt daran, dass mdDialog einen eigenen Bereich erstellt ... Ich habe versucht, den aktuellen Bereich zu übergeben, einen neuen zu erstellen, etc., aber bisher ohne Erfolg.

Das Problem kann leicht in der beigefügten Plombe reproduziert werden.

Relevante Quelle als Referenz:

function first() { 
    var directive = { 
     restrict: 'EA', 
     scope: { 
     param: '@' 
     }, 
     require: '^form', 
     bindToController: true, 
     template: '<md-input-container class="md-block"><label>Street with validation</label><input name="street" ng-model="vm.street" required><div ng-messages="form.street.$error"><div ng-message="required">Required</div></div></md-input-container>', 
     controller: FirstController, 
     controllerAs: 'first', 
     link: function(scope, element, attrs, form) { 
     scope.form = form; 
     } 
    }; 

    FirstController.$inject = []; 

    function FirstController() { 
     var first = this; 
    } 
    return directive; 
    } 


function openDialogFail(event) { 
    $mdDialog.show({ 
    template: '<md-dialog><md-dialog-content><first/></md-dialog-content></md-dialog>', 
    targetEvent: event, 
    controller:() => this //, 
     // scope: $scope.$new() 
    }); 
} 

Vielen Dank im Voraus für Ihre Hilfe!

Answer 1

von Kommentaren Extrahiert:

ich den Anwendungsfall immer noch nicht erhalten, aber nicht Sie etwas stoppen wickelt <first /> innerhalb eines separaten <form> wie in codepen.io/z00bs/pen/vGaBgm