0
我有兩個共享服務的組件,第一個組件具有2個按鈕,它們在點擊squeezeContent()
和unsqueezeContent()
時觸發2個方法,這些方法將一個數值傳遞給服務中的observable,然後將這個值從屬性中減去在共享相同服務的另一個組件,我一直在試圖找出使用可觀察到的,但我沒有這樣做是正確通過在角度上可觀察地更改組件的屬性值2
第一部分
import { Component, AfterViewInit, ElementRef, ViewChild } from '@angular/core';
import { CrosspropertiesService } from "../services/crossproperties.service";
@Component({
selector: 'app-timer',
templateUrl: './timer.component.html',
styleUrls: ['./timer.component.css']
})
export class TimerComponent implements AfterViewInit {
@ViewChild('timerBody') timerBody:ElementRef;
constructor(private crossproperties: CrosspropertiesService) { }
public timerBodyHeight:number;
ngAfterViewInit() {
this.timerBodyHeight = this.timerBody.nativeElement.offsetHeight;
}
squeezeContent(){
this.crossproperties.resizeHeight(this.timerBodyHeight);
}
unsqueezeContent(){
this.crossproperties.resizeHeight(0);
}
}
和服務文件
import { Injectable } from '@angular/core';
import { Observable } from 'rxjs';
import { Subject } from 'rxjs/Subject';
@Injectable()
export class CrosspropertiesService {
private subject = new Subject<any>();
resizeHeight(height:number){
this.subject.next({ value: height });
}
getSidebarScrollHeight(): Observable<any>{
return this.subject.asObservable();
}
constructor() { }
}
第二組分
import { Component, OnInit , OnDestroy, ElementRef, ViewChild} from '@angular/core';
import { CrosspropertiesService } from '../services/crossproperties.service';
import { Subscription } from 'rxjs/Subscription';
@Component({
selector: 'app-sidebar-expanded',
templateUrl: './sidebar-expanded.component.html',
styleUrls: ['./sidebar-expanded.component.css']
})
export class SidebarExpandedComponent implements OnInit {
subscription:Subscription;
private sidebarscrollheight:number;
constructor(private crossproperty: CrosspropertiesService) {
this.subscription = this.crossproperty.getSidebarScrollHeight().subscribe(height => { this.sidebarscrollheight = this.sidebarscrollheight - height; });
}
ngOnInit() {
this.sidebarscrollheight = 600; //computed value in this section
}
}
現在我想要被改變的sidebarscrollheight屬性值時squeezeContent()和unsqueezeContent()方法在部件1個通話在服務中的功能,sidebarscrollheight屬性已經有一些計算值,請任何幫助