mddialog TextArea- Modell wird nicht aktualisiert, wenn Änderungen in der Hauptsteuerung

Question

Dies ist eine Frage zu Angular Materialien ist, mdDialogs und Umfang Variablen:

• ich zu einem bestimmten Thema abonniert bin mit Stomp.
• Stomp empfängt Strings vom Server, die in einer Bereichsvariablen verkettet sind.
• Der Benutzer klickt auf eine Schaltfläche, um einen mdDialog anzuzeigen.
• mdDialog sollte die eingehenden String-Änderungen in einem Textfeld anzeigen.

Aber ... es funktioniert nicht richtig. Ich muss den Dialog schließen und erneut öffnen, um die Änderungen zu sehen. Ich habe versucht, den Textbereich in der Hauptansicht (index.html) hinzuzufügen und der Textbereich funktioniert ordnungsgemäß.

Warum ändert es nicht das Textfeld, wenn wir in mdDialog in Angular Materials sind? Irgendeine Idee, es zu lösen?

Dies ist Plunker Sie die Hauptansicht sehen (index.html) aktualisiert den Zufallswert richtig, aber wenn Sie den Dialog der Wert öffnet nicht korrekt aktualisiert ...

https://plnkr.co/edit/teC69Sg7UqNbouHxpT22

var angularInstance = angular.module('ExampleApp', ['ngMaterial', 'ngMessages']) ; 

angularInstance.controller('ExampleCtrl', function ExampleCtrl($scope, $mdDialog, $mdMedia, $interval) 
{ 
    $scope.randomString = "" ; 

    $scope.initialization = function() 
    { 
     $interval($scope.addRandomChar, 1000) ; 
    } 

    $scope.addRandomChar = function() 
    { 
     $scope.randomString = $scope.randomString + "a" ; 
    } 

    $scope.openMyDialog = function(ev) 
    { 
     var useFullScreen = ($mdMedia('sm') || $mdMedia('xs')) && $scope.customFullscreen ; 
     $mdDialog.show({ 
      controller: myDialogController, 
      templateUrl: 'myDialog.tmpl.html', 
      parent: angular.element(document.body), 
      targetEvent: ev, 
      clickOutsideToClose:true, 
      fullscreen: useFullScreen, 
      resolve: 
      { 
       randomString: function() 
       { 
        return $scope.randomString ; 
       } 
      } 
     }) ; 
    } 
}); 

function myDialogController($scope, $mdDialog, randomString) 
{ 
    $scope.randomString = randomString ; 

    $scope.close = function() 
    { 
     $mdDialog.cancel() ; 
    }; 
} 

Vielen Dank.

Answer 1

Hier haben Sie einen working plunker

Summieren, ich habe Sie die params vom ExampleCtrl-myDialogController, mit Einheimischen passieren leicht die Art und Weise verändert.

$mdDialog.show({ 
    controller: myDialogController, 
    templateUrl: 'myDialog.tmpl.html', 
    targetEvent: ev, 
    locals: {parent: $scope}, 
    clickOutsideToClose:true, 
    ... 

Dann in Ihren Dialog-Controller haben Sie Zugriff alle Umfänge parent:

function myDialogController($scope, $mdDialog, parent) { 
    $scope.parent = parent; 

    ... 
} 

So schließlich in der Ansicht, die Sie brauchen nur zu parent.randomString zu dem Text ng-model zu binden, und es wird funktionieren wie Sie erwarten:

<textarea ... ng-model="parent.randomString"/> 

Prost. Ich hoffe es hilft.