Aurelia - Component Lifecycle

Aurelia use component lifecycle methods to allow us manipulating component lificycle. In this chapter we will show you those methods and explain component lifecycle.

• constructor() − Constructor method is used for initializing object created with a class. This method is called first. If you don't specify this method, the default constructor will be used.
• created(owningView, myView) − This is called once the view and view-model are created and connected to controller. This method takes two arguments. The first one is the view where the component is declared (owningView). The second one component view (myView).
• bind(bindingContext, overrideContext) − At this point of time the binding has started. The first argument represents binding context of the component. The second one is overrideContext. This argument is used for adding additional contextual properties.
• attached() − Attached method is invoked once the component is attached to the DOM.
• detached() − This method is opposite to attached. It is invoked when component is removed from the DOM.
• unbind() &minu; The last lifecycle method is unbind. It is called when the component is unbound.

The lifecycle methods are useful when you want to have higher control over your component. You can use them when you need to trigger some functionalities at certain point of component lifecycle.
All lifecycle methods are shown below.

app.js

export class App {
   constructor(argument) {
      // Create and initialize your class object here...
   }

   created(owningView, myView) {
      // Invoked once the component is created...
   }

   bind(bindingContext, overrideContext) {
      // Invoked once the databinding is activated...
   }

   attached(argument) {
      // Invoked once the component is attached to the DOM...
   }

   detached(argument) {
      // Invoked when component is detached from the dom
   }

   unbind(argument) {
      // Invoked when component is unbound...
   }
}