Есть ли способ заполнить поля mdDialog после показа диалога?

У меня есть простой mdDialog для редактирования записей формы, который появляется при двойном щелчке строки сетки. Появляется диалоговое окно, и все работает, за исключением того, что я хотел бы заполнить поля в диалоговом окне содержимым строки сетки. Проблема в том, что я не уверен, где на самом деле это сделать, и к каждой точке, которую я пробовал до сих пор, обращаются до того, как на самом деле показан диалог, поэтому элементы HTML внутри диалога еще не существуют для заполнения. Вот метод, который вызывает диалог:

$scope.showUpdateDialog = function(data) {
    $mdDialog.show({
        controller: UpdateDialogController,
        scope: $scope.$new(),
        templateUrl: 'js/admin/UpdateUsersDialog.html',
        parent: angular.element(document.body),
        clickOutsideToClose:true,
        fullscreen:true
    })
    .then(function(answer) {
        $scope.status = 'Updated User';
    }, function() {
        $scope.status = 'Update User Failed';
    });
};

И вот контроллер для этого:

function UpdateDialogController($scope, $mdDialog) {
    $scope.hide = function() {
        $mdDialog.hide();
    };

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

    $scope.answer = function(answer) {
        $mdDialog.hide(answer);
    };

    $scope.add = function(dialogdata) {
      // For clarity I removed the contents of what happens with the add, as this part works fine.
    };
}   

Внутри этого templateUrl: 'js/admin/UpdateUsersDialog.html' есть несколько элементов, которые выглядят так:

        <input type="text" class="form-control" id="updatelogin"
            placeholder="Enter Name" data-ng-model="dialogdata.login" disabled />

Я думал, что бит data-ng-model позаботится об этом (dialogdata.login и т. Д. - все назначенные переменные, прежде чем диалог будет запущен), но это не так, поэтому я пытался форсировать его, делая что-то вроде этого:

    var ulogin = document.getElementById('updatelogin');
    ulogin.setInnerHTML(content.login);

... но поскольку элементы еще не существуют, переменная 'ulogin' продолжает возвращаться как ноль. Есть ли способ сделать это?

1 ответ

Хорошо, после некоторого разговора я кое-что выяснил, может быть, это может помочь другим, кто столкнулся с подобной проблемой. Решением для меня было поместить все в метод onRowDoubleClicked, который вызывается в ag-grid, когда я дважды щелкаю строку в сетке:

function onRowDoubleClicked() {
    var selectedRowNode = $scope.UserTableGrid.api.getSelectedNodes()[0];
    var data = selectedRowNode.data;
    $scope.login = data.login;
    $scope.name = data.name;
    $scope.email = data.email;
    $scope.type = data.roles;
    $scope.userId = $scope.getUserId($scope.login);
    showUDialog(data);
        function showUDialog(data) {
            $scope.email = data.email;
            $mdDialog.show({
                controller: UpdateDialogController,
                scope: $scope.$new(),
                templateUrl: 'js/admin/UpdateUsersDialog.html',
                parent: angular.element(document.body),
                clickOutsideToClose:true,
                fullscreen:true
            })
            .then(function(answer) {
                $scope.status = 'Updated User';
            }, function() {
                $scope.status = 'Update User Failed';
            });         
        }

        function UpdateDialogController($scope, $mdDialog) {
            $scope.hide = function() {
                $mdDialog.hide();
            };
            $scope.cancel = function() {
                $mdDialog.cancel();
            };
            $scope.answer = function(answer) {
                $mdDialog.hide(answer);
            };
            $scope.add = function() {

                //Close the Dialog
                $scope.answer("Completed");
                var userJson = {
                        "name" : $scope.name,
                        "login" : $scope.login,
                        "password" : "",
                        "roles" : $scope.type,
                        "email" : $scope.email,
                        "tpbUserId" : $scope.userId
                };
                var url = 'RobotDataInterface/User/updateUser';
                var data = JSON.stringify(userJson);
                $http.post(url, data).then(
                        function success(response) {
                            $scope.addUserCallback(response);
                        }, 
                        function failure(response) {
                            $scope.generalRestFailureCallback(response);
                        }
                );
            };
            $scope.addUserCallback = function(data) {
                console.log("User Updated!");
                $scope.loadTableData();
            }
        }   
}

Это исправило проблему с областью видимости и позволило заполнить поля в templateUrl, привязав их к тем же значениям:

        <input type="text" class="form-control" id="name"
            placeholder="Enter Name" data-ng-model="name" />
Другие вопросы по тегам