Base solution for your next web application
Open Closed

How to pass parameter to modal dialog #74


User avatar
0
lcyhjx created

Hi, I download module zero, and there is example for using modal dialog to create question. But now, I would like to pass parameter to modal dialog, I use resolve to pass parameter, so I make following change: In index.js

vm.showEditRoleDialog = function (roleId) {
                var modalInstance = $modal.open({
                    templateUrl: abp.appPath + 'App/Main/views/roles/editDialog.cshtml',                   
                    controller: 'app.views.roles.editDialog as vm',
                    resolve:
                        {
                           id: function () { return angular.copy(roleId); }
                        },
                    size: 'md'
                });
            };

And then in modalDialog.js

(function () {
    var controllerId = 'app.views.roles.editDialog';
    angular.module('app').controller(controllerId, [
        'abp.services.app.role', '$modalInstance',
        function (roleService, $modalInstance,id) {
            var vm = this;
            vm.id = id;
            vm.role = null;
        }
    ]);
})();

But the value of parameter id is not passed, could you please give me some suggestion?


6 Answer(s)
  • User Avatar
    0
    dinhienhy created

    You should use:

    resolve:
                            {
                               id: function () { return roleId; }
                            },
    

    Instead using:

    angular.copy(roleId)
    
  • User Avatar
    0
    lcyhjx created

    Hi,

    I make changes to:

    resolve:
                            {
                               id: function () { return roleId; }
                            },
    

    But the value of parameter id still not be passed. Any advice?

  • User Avatar
    0
    lcyhjx created

    I found there is an error thrown 'Uncaught TypeError: Cannot read property 'push' of undefined '

  • User Avatar
    0
    lcyhjx created

    resolved by using $scope to pass parameter, please see following sample code. But I am still do not know what's the problem when I use resolver to pass parameter.

    in index.js

    $scope.editRoleId = 0;
                vm.showEditRoleDialog = function (roleId) {
                    $scope.editRoleId = roleId;
                    var modalInstance = $modal.open({
                        templateUrl: abp.appPath + 'App/Main/views/roles/editDialog.cshtml',                   
                        controller: 'app.views.roles.editDialog as vm',                    
                        size: 'md',
                        scope:$scope,
                    });
    
    
                    modalInstance.result.then(function () {
                        vm.loadRoles();
                    });
                };
    

    in modalDialog.js

    (function () {
        var controllerId = 'app.views.roles.editDialog';
        angular.module('app').controller(controllerId, [
            'abp.services.app.role', '$modalInstance','$scope',
            function (roleService, $modalInstance,$scope) {
                var vm = this;
                vm.editRoleId = $scope.editRoleId;
            }
        ]);
    })();
    
  • User Avatar
    0
    hikalkan created
    Support Team

    Hi,

    Actually, this topic is completely related to AngularJs. Maybe you can find better help in an angularjs forum or in stackowerflow.

    But, as I see in your first post, you missed to add 'id' to injection list. Use this:

    (function () {
        var controllerId = 'app.views.roles.editDialog';
        angular.module('app').controller(controllerId, [
            'abp.services.app.role', '$modalInstance', 'id',
            function (roleService, $modalInstance,id) {
                var vm = this;
                vm.id = id;
                vm.role = null;
            }
        ]);
    })();
    
  • User Avatar
    0
    lcyhjx created

    Thanks so much. Yes, add 'id' to injection list, then it works fine.