Блог

Когда действие щелчка из компонента HeaderComponent

Значок Хедера

 <a href="javascript:void(0)" (click)="collapseSidebar()">
   <app-feather-icons id="sidebar-toggle" [icon]="'align-left'"></app-feather-icons>
</a>
 

   collapseSidebar() {
    this.navServices.collapseSidebar = !this.navServices.collapseSidebar
  }
 

 export class NavService {

    public screenWidth: any
    public collapseSidebar: boolean = false;

    constructor(private http: HttpClient,) {
        this.onResize();
        if (this.screenWidth < 991) {
            this.collapseSidebar = true
        }
    }
}
 

Все работает нормально

Но когда я попробовал компонент страницы, он использовал ту же функцию, но не работал.

Значок страницы

   collapseSidebar() {
    this.navServices.collapseSidebar = !this.navServices.collapseSidebar
  }
 

Примечание: Головной компонент и служба внутри общей папки, я опробовал этот компонент общей папки.

У тебя есть какие-нибудь идеи?

Возможно, ваша операция асинхронна или обнаружение изменений angular не запускается, потому collapseSidebar что находится в эксплуатации (не как поле компонента).

Вы должны использовать наблюдаемые объекты для обеспечения связи между компонентами из службы.

Для дальнейшего понимания https://angular.io/tutorial/toh-pt4#observable-data