当主控制器发生变化时，mddialog textarea 模型不会更新

Question

这是一个关于 Angular 材料、mdDialogs 和范围变量的问题：

我使用 Stomp 订阅了特定主题。
Stomp 从服务器接收字符串，这些字符串在范围变量中串联。
用户单击按钮以显示 mdDialog。
mdDialog 应在文本区域中显示传入的字符串更改。

但是...它无法正常工作。我必须关闭并重新打开对话框才能看到更改。我尝试在主视图中添加文本区域 (index.html)，文本区域正常工作。

当我们在 Angular Materials 中的 mdDialog 中时，为什么它不更改文本区域？有解决办法吗？

这是您可以看到主视图 (index.html) 正确更新随机值的插件，但是如果您打开对话框，该值将不会正确更新...

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() ;
    };
}

非常感谢。

Answer 1

Here you have a working plunker

总而言之，我使用 locals.

稍微改变了将参数从 ExampleCtrl 传递到 myDialogController 的方式

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

然后，在您的对话控制器中，您可以访问所有父范围：

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

    ...
}

最后，在视图中，您只需将 parent.randomString 绑定到文本区域 ng-model，它就会如您所愿地工作：

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

干杯。希望对你有帮助。

当主控制器发生变化时，mddialog textarea 模型不会更新

mddialog textarea model is not updated when changes in the main controller

dialog

customdialog

angularjs

angular-material

mddialog