낮은 인터페이스

창 크기 조정 이벤트를 쉽게 연결하고 싶습니다. 그래서 우리는 이 함수를 만듭니다.

import { Subject } from 'rxjs';
interface wh {
  width: string;
  height: string;
}
const sub = new Subject<wh>();
export function _resizeEvent(): Subject<wh> {
  debugger;
  window.addEventListener('resize', (ev) => {
    let window = ev.target as Window;
    let ele = window.document.activeElement as HTMLElement;
    let width = ele.offsetWidth.toString();
    let height = ele.offsetHeight.toString();
    sub.next({ width: width, height: height });
  });
  return sub;
}

위의 코드를 사용하려면:

import { _resizeEvent } from './functions/observers';

_resizeEvent().subscribe(result=>{
       this.width=result.width;
    }); 

Intellisense는 이제 입력할 때 두 속성을 모두 보여줍니다.



인터페이스 정의는 클래스 정의와 달리 new 키워드를 지원하지 않습니다. 이것은 둘 사이의 거의 유일한 차이점입니다.