File

src/app/components/context/context.component.ts

Description

Context component ~implements OnInit ~implements OnDestroy

Implements

OnInit OnDestroy

Metadata

Index

Properties
Methods
Inputs

Constructor

constructor(contextService: ContextService, uiService: UiService, inputService: InputService)

Constructs the context component.

Parameters :
Name Type Optional Description
contextService ContextService No

The context service injected dependency.

uiService UiService No

The ui service injected dependency.

inputService InputService No

The input service injected dependency.

Inputs

caption
Type : string
Default value : ''

Context caption

context
Type : Context

Context.

title
Type : string
Default value : ''

Context tooltip title

Methods

ngOnDestroy
ngOnDestroy()

Cleanup

Returns : void
ngOnInit
ngOnInit()

Subscription

Returns : void
Public onDelete
onDelete(event: MouseEvent)

On context deletion event handler

Parameters :
Name Type Optional
event MouseEvent No
Returns : void
Public onSelect
onSelect(event: MouseEvent, item: Context)

On context selection event handler

Parameters :
Name Type Optional
event MouseEvent No
item Context No
Returns : void

Properties

clickableDelete
Type : ElementRef<HTMLSpanElement>
Decorators :
@ViewChild('clickableDelete')

Delete clickable element.

clickableTab
Type : ElementRef<HTMLElement>
Decorators :
@ViewChild('clickableTab')

Tab clickable element.

Public Readonly contextService
Type : ContextService
The context service injected dependency.
input
Type : ElementRef<HTMLInputElement>
Decorators :
@ViewChild('input')

Input element.

Public Readonly inputService
Type : InputService
The input service injected dependency.
Public Readonly NavState
Default value : NavState

Nav state enum accessor.

Public Readonly uiService
Type : UiService
The ui service injected dependency.

./context.component.scss

@use "../stylesheets/stylesheets.component.scss" as component;
@use "../stylesheets/stylesheets.component.color.scss" as color;

input {
    height: 1.75em;
    border: none;
    font-size: 30px;
    border-radius: component.$border-radius;
}

#delete {
    position: absolute;
    right: 10px;
    top: 0;
    bottom: 0;
    margin: auto;
    font-size: 30px;
    cursor: pointer;
    color: color.$header-fore-color;
}
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""