TerminalTerminal is a text based user interface. Enter "date" to display the current date.

Documentation

Import

import {TerminalModule} from 'primeng/terminal';
 

Getting Started

Commands are processed using observables via the TerminalService. Import this service into your component and subscribe to commandHandler to process commands by sending replies with sendResponse function.

import {Component} from '@angular/core';
import {TerminalService} from 'primeng/components/terminal/terminalservice';
@Component({
    template: '<p-terminal welcomeMessage="Welcome to PrimeNG" prompt="primeng $"></p-terminal>',
    providers: [TerminalService]
})
export class TerminalDemo {
    constructor(private terminalService: TerminalService) {
        this.terminalService.commandHandler.subscribe(command => {
            let response = (command === 'date') ? new Date().toDateString() : 'Unknown command: ' + command;
            this.terminalService.sendResponse(response);
        });
    }
}
 

Properties

Styling

Following is the list of structural style classes, for theming classes visit theming page.

Dependencies

None.

Source

View on GitHub

<p-terminal welcomeMessage="Welcome to PrimeNG" prompt="primeng $"></p-terminal>
 

import {Component} from '@angular/core';
import {TerminalService} from 'primeng/components/terminal/terminalservice';
import {Subscription} from 'rxjs/Subscription';
@Component({
    templateUrl: './terminaldemo.html',
    providers: [TerminalService]
})
export class TerminalDemo {
    subscription: Subscription;
    constructor(private terminalService: TerminalService) {
        this.terminalService.commandHandler.subscribe(command => {
            let response = (command === 'date') ? new Date().toDateString() : 'Unknown command: ' + command;
            this.terminalService.sendResponse(response);
        });
    }
    ngOnDestroy() {
        if(this.subscription) {
            this.subscription.unsubscribe();
        }
    }
}