Question

我有一个简单的mdDialog用于编辑表单条目，双击网格行时弹出。对话框出现，一切正常，但我想在对话框中填充网格行的内容。问题是我不确定在哪里实际执行此操作，并且在实际显示Dialog之前访问了我迄今为止尝试过的每个位置，因此对话框内的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.
    };
}

在该模板内部：'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'var继续返回null。有没有办法做到这一点？

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

这修复了一个范围问题，并允许模板中的字段通过将它们绑定到相同的值来填充：

        <input type="text" class="form-control" id="name"
            placeholder="Enter Name" data-ng-model="name" />

在Dialog显示后，有没有办法填充mdDialog字段？

1 个答案: