@angular/router#UrlSerializer TypeScript Examples

The following examples show how to use @angular/router#UrlSerializer. You can vote up the ones you like or vote down the ones you don't like, and go to the original project or source file by following the links above each example. You may check out the related API usage on the sidebar.
Example #1
Source File: dashboard.service.ts    From sba-angular with MIT License 5 votes vote down vote up 
constructor(
        public modalService: ModalService,
        public userSettingsService: UserSettingsWebService,
        public loginService: LoginService,
        public prefs: UserPreferences,
        public searchService: SearchService,
        public notificationService: NotificationsService,
        public router: Router,
        public location: Location,
        public urlSerializer: UrlSerializer,
        public clipboard: Clipboard,
        public intlService: IntlService
    ) {

        // Default options of the Gridster dashboard
        this.options = {
            swap: true,
            draggable: {
                enabled: true,
                ignoreContent: true, // By default, dragging is impossible
                dragHandleClass: 'card-header', // except in the facet header
                ignoreContentClass: 'btn-group', // *except* in the button group
            },
            resizable: {enabled: true},
            itemChangeCallback: (item, itemComponent) => {
                this.notifyItemChange(item as DashboardItem);
            },
            itemResizeCallback: (item, itemComponent) => {
                if (!document.fullscreenElement) { // Exclude the change detection on switch from/to full-screen mode
                    /** Items must know their height/width to (re)size their content*/
                    if (!itemComponent.el.classList.contains('widget-maximized-view')) {
                        item.height = itemComponent.height;
                        item.width = itemComponent.width;
                    } else {
                        item.height = itemComponent.gridster.curHeight;
                        item.width = itemComponent.gridster.curWidth;
                    }
                    this.notifyItemChange(item as DashboardItem);
                }
            },
            scrollToNewItems: true, // Scroll to new items when inserted
            gridType: 'verticalFixed', // The grid has a fixed size vertically, and fits the screen horizontally
            fixedRowHeight: (window.innerHeight - 150) / 4, // 150px to account for header and margins
            minRows: 4,
            minCols: 4
        };

        // Manage URL changes (which may include dashboard name or config to be imported)
        this.router.events.subscribe(event => {
            if(event instanceof NavigationEnd) {
                this.handleNavigation();
            }
        })

        // Dashboards are stored in User Settings
        this.userSettingsService.events.subscribe(event => {
            // E.g. new login occurs
            // ==> Menus need to be rebuilt
            if(this.openAction) {
                this.updateOpenAction();
                this.updateAutoSaveAction();
                this.setLayout(this.layout);
            }
        });

        // Manage Autosave
        this.dashboardChanged.subscribe(dashboard => {
            if(this.autoSave && this.isDashboardSaved()) {
                this.debounceSave();
            }
        });
    }