Apologies for the question, but I'm relatively new to Typescript and Ionic, and I find myself a bit lost on how to proceed.
I have a JSON file containing 150 entries that follow a quite simple interface declaration:
export interface ReverseWords {
id: number;
todo: string;
solution: string;}
Additionally, I have a service in place that reads the JSON file and returns an Observable of this particular type (ReverseWords)
getReverseWords() {
return this.http.get<ReverseWords>('/assets/data/reves.json');}
In my .ts file, I utilize the service to retrieve all the content from the JSON file. However, I'm struggling with extracting just one entry based on a random position.
In the .ts file:
reverseWords: Observable<ReverseWords>; // Contains all JSON content
reverseWordsSelected: Observable<ReverseWords>; // Intended to hold a single entry
Within ngOnInit():
this.reverseWords = this.dataservice.getReverseWords();
Thus far, everything seems fine as I can view all the content and log it to the console. Since I'm using Observables, subscription is required to access the information. Despite employing rxjs/operators pipe and filter, nothing appears in the Chrome developer console (no errors either).
const reverseWordSelectedByPosition = this.reverseWords.pipe(filter(reverseWord => reverseWord.id === randomPosition));
reverseWordSelectedByPosition.subscribe(console.log);
If anyone could provide guidance on what I might be overlooking, it would be greatly appreciated.
Furthermore, I experimented by adjusting the service as follows:
getReverseWords() {
return this.http.get<ReverseWords[]>('/assets/data/reves.json');}
Subsequently updated the .ts file:
reverseWords: Observable<ReverseWords[]>;
Regrettably, the same issue persists.
Interestingly, when conducting a simple test in the .ts file like so:
const test = from([
{
id: 1,
todo: 'chapter',
solution: 'r-e-t-p-a-h-c'
},
{
id: 2,
todo: 'claustrofobia',
solution: 'a-i-b-o-f-o-r-t-s-u-a-l-c'
},
{
id: 3,
todo: 'keyboard',
solution: 'd-r-a-o-b-y-e-k'
}
]);
All functions flawlessly, displaying only one entry in the log at a time according to selection.
Any advice or assistance would be greatly welcome!
Per TotallyNewb's recommendation, I've included an example of the JSON file comprising just three entries:
[
{
"id": 1,
"todo": "chapter",
"solution": "r-e-t-p-a-h-c"
},
{
"id": 2,
": "claustraphobia",
":solution": "a-i-b-o-f-o-r-t-s-u-a-l-c"
},
{
"id":: 3,
"oto""kbdraeoyekwd",
"oltisuird": "jeshcefiejiefijeijfei"
]