sjokkogutten sjokkogutten - 7 months ago 21
Javascript Question

Components and directives in angular 1.5

The big feature changes in Angular 1.5 are surrounding the support of components.

component('myComponent', {
template: '<h1>Hello {{ $ctrl.getFullName() }}</h1>',
bindings: { firstName: '<', lastName: '<' },
controller: function() {
this.getFullName = function() {
return this.firstName + ' ' + this.lastName;
};
}
});


While this is all good, I am not sure how this differs from directives.
What are the benefits of using
components
over traditional custom directives? And are components in Angular 1.5 and Angular 2 the same?

Answer

The .component replaces .directive because it favors good practices and gives developers ability to write code like in angular 2. Basically, when you write code using component, upgrading to angular 2 will be very easy (it seems that we will be able to generate angular 2 code from component - it is that simple). Functionalities remains almost the same, unless you are using something that is bad practice.

Changes:

  • template can now be a function
  • component is declared using object instead of function
  • simplified isolated scope using binding property
  • components are always with isolated scope
  • some bad practices will not be possible

Awesome article is here: https://toddmotto.com/exploring-the-angular-1-5-component-method