unable to successfully complete parameter in angular 2

After receiving data from the API, I am using the subscribe method to execute lines of code. Below is the code snippet:

this.attRecService.getAgendaData(moment(this.viewDate).format('YYYY-MM')).subscribe(
        resp => {
            this.agendaData = resp;

            for (let item of resp) {
                if (item.schedule) {
                    for (let sched of item.schedule) {
                        this.events.push({
                            'start': new Date(moment(item.date).format('YYYY-MM-DD')),
                            'title': sched.title 
                        });
                    }
                }
            }
        },
        () => {
            console.log('display');
            this.displayClockDetail();
        }
    );

However, when attempting to log the word display, it appears that the code does not reach that part. What could be causing this issue?

Answer №1

This specific method

() => {
    console.log('output');
    this.showData();
}

is designed to execute only in case of an unsuccessful request (errors occurring) and when proper error handling is not implemented.

If you require a function to run upon completion of the observable, you can provide it as the third argument to the subscribe method.

.subscibe(() => { success }, () => { failure }, () => { finished })

Answer №2

Give this code a shot, then check the console to see what message is being displayed:

this.attRecService.getAgendaData(moment(this.viewDate).format('YYYY-MM'))
.subscribe((res: any) => {
  if(res) {
    for (let item of resp) {
      if (item.schedule) {
        for (let sched of item.schedule) {
          this.events.push({
            'start': new Date(moment(item.date).format('YYYY-MM-DD')),
            'title': sched.title 
          });
        }
      }
    }
    console.log('display');
  }
}, (error?: any) => {
  console.log('error');
});

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

Sign up for an observable within an observable

Imagine a scenario where there is a function in a provider: saveCar(car: Car) { return this.saveCarImages(car).subscribe( (data:any) => { if(data[0].seats){ car=data[0]; } return this.api.put(`/car/${car.id}`, ca ...

Eliminating an element from an object containing nested arrays

Greetings, I am currently working with an object structured like the following: var obj= { _id: string; name: string; loc: [{ locname: string; locId: string; locadd: [{ st: string; zip: str ...

Tips for sending a value to a container component

Within my task management application, I have implemented two selectors: export const selectFilter = (state: RootState) => state.visibilityFilter export const selectVisibleTodos = createSelector( [selectTodos, selectFilter], (todos: Todo[], filter : ...

Filter the output from a function that has the ability to produce a Promise returning a boolean value or a

I can't help but wonder if anyone has encountered this issue before. Prior to this, my EventHandler structure looked like: export interface EventHandler { name: string; canHandleEvent(event: EventEntity): boolean; handleEvent(event: EventEntity ...

What is the best way to incorporate sturdy data types into the alternative function for this switch statement

const switchcase = (value, cases, defaultCase) => { const valueString = String(value); const result = Object.keys(cases).includes(valueString) ? cases[valueString] : defaultCase; return typeof result === 'function' ? result() : r ...

Every time I attempt to make an HTTP request, I encounter a cross-origin error

When I make requests from the browser, they are valid. However, when using the Angular 9 app, I receive a 401 error. Below is the header from Chrome: Request URL: http://localhost:1234/api/Common/GetMy_List Request Method: GET Status Code: 401 Referre ...

Issue encountered with Ionic and ssh2: process.binding is not supported

I am currently delving into the world of Ionic and experimenting with creating a basic application that utilizes SSH2 to establish an ssh connection between the app and a server. Here is a breakdown of the steps I took to encounter the issue: Steps to Rep ...

Transforming a current angular 2 project to incorporate angular CLI

I was working on a project which wasn't set up using the 'ng new' command, but rather I followed the steps outlined in the quickstart guide. However, whenever I try to use an angular CLI command like 'ng generate', I keep getting t ...

Step-by-step guide for deploying an Angular 2 CLI app on GitHub

As a front-end engineer, I have limited experience with deployment. Currently, I am working on my pet project using angular-cli. What is the best way to deploy it on GitHub Pages? Are there any other straightforward methods for deployment? ...

What steps can I take to safeguard my App API from unauthorized access and misuse?

Is this the right place to ask for help with my app that is split into frontend (Angular) and backend/API (Nodejs)? The API has public endpoints for the frontend, but I want to protect it from being accessed or exploited by unauthorized parties. I consid ...

RC7 is missing the necessary HTTP_PROVIDERS for the resolveAndCreate HTTP method in Angular2

During the time of RC4, I was able to create my own custom http instance using a function like this: export function createHTTP(url:string, headers?:Headers){ let injector = ReflectiveInjector.resolveAndCreate([ myHttp, {provide:'defaultUrl ...

Ways to transfer a value between two different card elements

I have designed a component with three div cards side by side using bootstrap. The first card displays a list of products, and my intention is that when a product is clicked, the details should appear in the second card on the same page. However, this fun ...

Why is the format incorrect when the Angular 7 (Change)-Function on Input of type Date isn't functioning?

I am facing an issue with updating the date using key input and assigning the selected date to a property of my object. Below is the code I'm currently working with: <input type="date" [value]="dateTime()" (change)="setDate($event)"/> The dat ...

Steps for converting an Array of tuples into a Union of Tuples

I am attempting to develop a custom type that, when given an array of tuples as input, will generate the union of each index within the tuple. This may not be the most accurate terminology, but I hope you understand what I mean. const entries = [["name", ...

Change a TypeScript alias within the @types namespace

While using Typescript 3, I encountered a situation where I needed to modify a type alias from the @types/json-schema definition provided by DefinitelyTyped. The issue arose when I wanted to incorporate a custom schema type into my code. Since this custom ...

Ways to display an icon in Angular 10 only when it is hovered over

Just getting started with Angular and still learning the concepts. Trying to figure out how to show an icon only when it's hovered over. Can anyone assist me? Sorry, can't share the code because of company rules. The icons are for sorting and ...

Unable to swap out string with text box in TypeScript

I am trying to swap __ with a text box in Angular 2/4. Take a look at the example provided in the link below. https://stackblitz.com/edit/angular-ajkvyq?file=app%2Fapp.component.ts ...

Struggling to connect the array of objects from the .ts file with the template (.html) in Angular

Inside this .ts file, I am populating the "mesMenus" array that I want to display in the .html file: export class MenusComponent{ mesMenus= new Array<Menu>(); constructor(private gMenuService:GestionMenuService){ this.gMenuService.onAdd ...

A method for handling specific subsets of an enum in a secure and controlled manner

I have an enumerated type called Country and another type that represents a subset of European countries. I want to handle values within this subset differently from others. Currently, I am using an if statement with multiple conditions, but it could get u ...

TS - The 'new' keyword can only be used with a void function

I'm encountering a strange TypeScript error: "Only a void function can be called with the 'new' keyword." What in the world? The constructor function looks like this: function Suman(obj: ISumanInputs): void { const projectRoot = _su ...