BackgroundBehavior Link

The Link behavior can be used to navigate to a desiredroute by using its ID. A click event will be attached tothe element on which the behavior is defined.

Example

A simple example that creates a link to the route with theID about.

<button link="about">About</button>
alias

{ default } from mahalo/behaviors/link

Hierarchy

Index

Constructors

Properties

Methods

Object literals

Constructors

constructor

  • new Link(id: string): Link

Properties

element

element:Element

The element the behavior was attached to.

listener

listener:EventListener

The callback function that triggers the route change.

Static bindings

bindings:Object

This static property lets you define listeners that will be executed whenproperties of the behavior change.

It should be a map where the keys are paths that should be watched on the behavior instanceand the values are names of methods that will be invoked on it when the valueat a path changes.

Example

The following example shows a behavior that reacts to a change in the height ofthe defining element.

export default class MyBehavior extends Behavior {    static inject: {element: Element};    static bindings = {        'element.clientHeight': 'heightChange'    };    width: number;    heightChange(height: number) {        this.width = height * 2;    }}

Static update

update:string

This static property defines the name of an instance method thatwill be executed when the bahavior's value changes. Thatsimply means that the result of the expression that was createdfrom the value of the attribute used to define the behavior ina template has changed.

This will always create a one way binding.

Example

The following bahavior will execute its update method everytime the result of the expression given as an attribute valuechanges.

export default class MyBehavior extends Behavior {    static update = 'update';    update() {}}

Methods

remove

  • remove(): void
  • Removes the added event listener.

    Returns void

Object literals

Static inject

inject:object

element

element:Element = Element