CODEWITHSUNDEEP
htmlangulartypescriptobservable
Rob None
Rob None

Reputation: 551

Detect if a boolean changes Angular 8

I have this ngbCollapse in my html:

<div style="margin: 1.5em 1.5em;" [ngbCollapse]="isCollapsed">
//things
</div>

In my component, I would call a method everytime isCollapsed changes:

export class Component implements OnInit {

public isCollapsed = true;

constructor(private Serv: _service) {}

  ngOnInit() {}

//Everytime isCollapsed changes I would call this method
isCollapsedInService () {
 this._service.set(isCollapsed);
}

Upvotes: 0

Views: 822

Answers (2)

saad shafiq
saad shafiq

Reputation: 162

In html file

<button (click)="isCollapsedInService($event)">Btn</button> <!--Event Binding-->

In .ts file

import { Component } from '@angular/core';    
@Component({    
  selector: 'app-root',    
  templateUrl: './app.component.html',    
  styleUrls: ['./app.component.css']    
})    
export class AppComponent {      
 isCollapsedInService($event){    
    console.log("Button is clicked!", $event);    
  }    
}

Upvotes: 1

saad shafiq
saad shafiq

Reputation: 162

I would suggest you use Event Binding in Angular

In Angular 8, event binding is used to handle the events raised from the DOM like button click, mouse movement etc. When the DOM event happens (eg. click, change), it calls the specified method in the component.

https://www.javatpoint.com/event-binding-in-angular-8#:~:text=In%20Angular%208%2C%20event%20binding,specified%20method%20in%20the%20component.

Upvotes: 1

Related Questions