The function does not yield any result

import { Injectable } from '@angular/core';

export class Test {
  public id: number; public name: string; public fid: number
};

export const TESTS2: Test[] = [
  {id: 1, name: 'Lion', fid: 1},
  {id: 2, name: 'Tiger', fid: 1},
  {id: 3, name: 'Bear', fid: 1},
  {id: 4, name: 'Wolf', fid: 1},
  {id: 5, name: 'Fox', fid: 2},
  {id: 6, name: 'Panda', fid: 2},
  {id: 7, name: 'Kangaroo', fid: 2},
  {id: 8, name: 'Giraffe', fid: 2},
  {id: 9, name: 'Zebra', fid: 3},
  {id: 10, name: 'Horse', fid: 3},
  {id: 11, name: 'Llama', fid: 3},
  {id: 12, name: 'Squirrel', fid: 3}];

let testsPromise2 = Promise.resolve(TESTS2);

@Injectable()
export class TestService2 {
  getTests(id) { 
    let items: Test[] = [];
    for(var i = 0; i < TESTS2.length; i++) {
        if(TESTS2[i].fid == id) { 
        items.push(TESTS2[i]) 
        }
    }
    return testsPromise2;
 }
}

I am encountering an issue where TESTS is not accessible within the getTests function, however, testsPromise can be accessed as I receive all data if I return testsPromise in the getTests function. Why is this happening?

Answer №1

Make sure to start by initializing your items:

  let itemList: Item[] = [];

Answer №2

Can Test be considered an interface in this scenario?

interface Test {
    id: number;
    name: string;
    fid: number;
}

If that is the case, ensure to initialize the items array before starting the loop (using let):

getTests(id: number) {
    let items: Test[] = [];
    // ...
}

Also, confirm that the declaration of TESTS is accessible within the function:

getTests(id: number) {
    console.log(TESTS); // can you see this output?
    // ...
}

By following the steps above, your code should function correctly.


As a bonus tip, for further optimization, consider rephrasing your function into a single line:

getTests(id: number): Test[] {
    return TESTS.filter((oneTest: Test) => oneTest.fid === id);
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Tips for creating a test to choose a movie from the MuiAutocomplete-root interface

I am currently utilizing Material UI with React using Typescript and I am looking to create a test for the autocomplete functionality using Cypress. Here is the approach I have taken: Identifying the Autocomplete component and opening it, Choosing an opti ...

Utilizing Angular 2 with Bootstrap's popup modal feature

Is it possible to implement a popup modal in my Angular 2 application without relying on popular packages like ng2-opd-pop or similar solutions? I have included Bootstrap by importing it in my styles.css using '@import '../../../Content/bootstra ...

What is the best way to adjust the Directions route Polyline to the edge of the map canvas?

I am currently working on a project that involves direction mapping, and I need the directions to be displayed on the right side of the panel when rendered. Here is what I am currently getting: However, I do not want the directions to appear behind the pa ...

Experimenting with a customizable Vue.js autocomplete feature

Check out this sample code: https://jsfiddle.net/JLLMNCHR/09qtwbL6/96/ The following is the HTML code: <div id="app"> <button type="button" v-on:click="displayVal()">Button1</button> <autocomplete v- ...

Unable to retrieve value - angularJS

An AngularJS application has been developed to dynamically display specific values in an HTML table. The table consists of six columns, where three (Work Name, Team Name, Place Name) are fixed statically, and the remaining three columns (Service One, Servi ...

Understanding @@iterator in JavaScript: An in-depth look

Can someone shed some light on the mysterious @@iterator? It keeps popping up in tutorials but no one seems to provide a clear explanation of what it actually is. Is it a symbol literal or something else entirely? ...

How to display a festive greeting on the specific holiday date using the ngx-bootstrap datepicker

Currently, I have implemented the ngx-bootstrap datepicker for managing appointment schedules. I have disabled weekend days and holiday dates, but now there is a requirement to display a tooltip with a holiday message when hovering over a holiday date. htt ...

tips for exporting database information to an excel file with the help of ajax request and javascript

Recently, I built an application using NDWS with sapui5 _javascript. Within the application, there is a table that contains data synced with the server's database. My goal is to retrieve this data from the table and export it to an Excel document. Her ...

Guide to executing a fetch request prior to another fetch in React Native

I am currently working on a project using React Native. One issue I have run into is that all fetch requests are being executed simultaneously. What I actually need is for one fetch to wait until the previous one has completed before using its data. Speci ...

Error: The object is not defined (evaluating '_$$_REQUIRE(_dependencyMap[32], "react-native-safe-area-context").SafeAreaView')

I am currently working on developing a chat application using react-native with the following dependencies: "dependencies": { "@react-native-async-storage/async-storage": "~1.17.3", "@react-native-community/masked ...

issue with integrating promise in angular 4

I'm currently learning about promises and how to implement them in Angular. I have written the following code in StackBlitz. My goal is to display the array whenever it contains a value by using promises in Angular. This is my HTML code: <h2>A ...

Is it possible to reset the text within the text box when the form is being submitted using the load() ajax function?

I am working on implementing a comment feature where the data entered in the form is appended and displayed after submission. Here is my HTML form: <table> <tr><td>Name :</td><td> <input type="text" id="name"/></td&g ...

"Combining the power of AngularJS2 beta with Spring Boot: the ultimate

I am currently using Atom 1.4.0 with the atom-typescript package to develop AngularJS2 modules in TypeScript. On the backend, I have a spring-boot application for handling the REST APIs. After making changes to the .ts files in Atom, it seems to compile t ...

Tips for augmenting cell with additional data in react-datepicker

Is it possible to include additional text in a cell using react-datepicker? For example, similar to what is shown in this image: view image here ...

Develop a nodejs script to make a request using a curl or similar method

Can anyone help me figure out how to replicate the functionality of this OpenSSL command using Node.js or curl? The command is: openssl s_client api-prd.koerich.com.br:443 2> / dev / null | openssl x509 -noout -dates. I have been unsuccessful in my at ...

Executing MySQL queries synchronously in Node.js

When working with NodeJS and mysql2 to save data in a database, there are times when I need to perform database saves synchronously. An example of this is below: if(rent.client.id === 0){ //Save client connection.query('INSERT INTO clients (n ...

Create a new variable to activate a function within the parent component in Vue

I want to invoke a function in the parent component from its child component. In my Vue project, I have designed a reusable component that can be used across multiple pages. After the function is executed in this component, I aim to call a specific functi ...

Effortless 'rotational' script

I am currently developing a HTML5 Canvas game with the help of JavaScript. My aim is to create an object that smoothly transitions to a specific direction. The direction is being stored as a variable and calculated in radians. Here's how the code op ...

"Ajax validation is causing the duplication of the HTML page content within an HTML

My PHP username validation with Ajax code seems to be duplicating my HTML page inside an HTML div element, which is used for displaying Ajax errors. Despite trying various solutions and searching on Google, I have not been able to find a resolution yet. Th ...

Integrating Excel into a webpage - is it possible?

Currently facing an issue on my website. I'm trying to open a 'file://' URL directly with the <a href=""> element in a browser, but it's prohibited. I'm searching for a plugin or similar solution that can enable me to execut ...