Angular에서 한 state에서 다른 state를 가져와서 해당 state의 속성을 읽기 전용으로 사용하고자하는 경우가 있습니다. 기본적으로 지원되지는 않지만, 가능하게끔 만들 수 있습니다. 이 방법을 shared state라고 합니다.
두 개의 저장소가 있다고 가정하겠습니다: Animal 그리고 Preferences 입니다.
localstorage 에 존재하는 Preferences 저장소에는 Animal을 정렬할 수 있는 정렬순서가 존재합니다. 동물들을 순서대로 정렬하기 위해서 정렬순서를 Preferences에서 가져와서 사용해야만 합니다. 이때 필요한 것은 바로 selectSnapshot 입니다.
어떻게 사용하는지 예제로 살펴보겠습니다:
Animal 에서 selectSnapshot 을 사용하여 Preferences의 sort state를 가져올 수 있습니다.
어때요, 간단히 가져올 수 있죠?😃
그런데, 저의 경우 한 가지 문제가 발생했습니다.
위의 예시와 거의 동일한 경우에서 selectSnapshot 을 사용하였는데, 다음과 같은 에러가 발생했습니다…
Uncaught Error: Can't resolve all parameters for CLASS저와 같이 selectSnapshot 사용에 의해서 발생한 에러는 아니지만, 에러 해결 방법은 @State 가 끝나는 지점에 @Injectable을 사용하여 해결하였습니다.
Angular 공식문서에 따르면, @Injectable은 해당 클래스를 의존성으로써 제공가능하고 주입가능한 클래스라고 표시하는 역할을 한다고 합니다.
지금까지 selectSnapshot 을 사용하여 한 state 컨테이너에서 다른 state를 가져오는 방법에 대해 알아보았습니다.
정확하지 않은 내용은 댓글로 알려주시면 감사하겠습니다!
참고
