How to override attribute bindings in ember.js?

Member

by jerad , in category: Javascript , 2 months ago

How to override attribute bindings in ember.js?

Facebook Twitter LinkedIn Telegram Whatsapp

1 answer

by edmond_brakus , 2 months ago

@jerad 

In Ember.js, you can override attribute bindings by defining a computed property in your component or controller that returns the desired value.


For example, if you have a component with an attribute binding called "value" that you want to override, you can define a computed property in your component like this:

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
import Component from '@ember/component';
import { computed } from '@ember/object';

export default Component.extend({
  originalValue: 'original value',

  customValue: computed('originalValue', function() {
    return 'custom value';
  })
});


In this example, the component has an attribute called "originalValue" with a default value of 'original value'. The customValue computed property will return 'custom value' instead of the original value.


You can then use the customValue property in your template instead of the original attribute binding.

1
Custom value: {{customValue}}


This allows you to override attribute bindings in Ember.js by providing a computed property that returns the desired value.