How to add a class in ember.js?

@giovanny.lueilwitz 

In Ember.js, you can add a class to an element in a template by simply using the class attribute and binding it to a property in your component or controller. Here's how you can do it:

1. In your template file (e.g., my-template.hbs), add the class attribute to the element where you want to add the class:

1

<div class={{myClass}}>Hello, Ember!</div>

1. In your component or controller file (e.g., my-component.js), define a property named myClass and set it to the desired class name:

1
2
3
4
5
6

import Component from '@glimmer/component';
import { tracked } from '@glimmer/tracking';

export default class MyComponent extends Component {
  @tracked myClass = 'my-custom-class';
}

Now, when the template is rendered, the class my-custom-class will be added to the <div> element. You can change the value of myClass dynamically in your component or controller to add different classes based on certain conditions or user interactions.