How to Create Service in Angular 10?

How to Create Service in Angular 10?

This post will give you example of Angular 10 create service example. Let’s discuss about how to create service in Angular 10 using CLI. Let’s discuss about how to create service in Angular 10. You can understand a concept of how to create data service in Angular 10.

This post will give you example of Angular 10 create service example. Let’s discuss about how to create service in Angular 10 using CLI. Let’s discuss about how to create service in Angular 10. You can understand a concept of how to create data service in Angular 10.

There are set of commands provided by Angular 10 application. one from there, we will use that command to creating service in Angular 10 application.

As we know, service class will help to getting data using API. In angular service we call api and get data from that api. service will easy to available for getting data on angular application. Right now i will give you very simple example without any api,

Create Service

Here, we will create simple service using cli command. in service file we will create getPosts() and we will return array.

Let's run bellow command to create Post Service:

ng g service Post

Now you can see there is a created post.service.ts file. you can update like as bellow file:

src/app/post.service.ts

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

@Injectable({
  providedIn: 'root'
})
export class PostService {

  constructor() { }

  getPosts(){
    return [
      {
        id: 1,
        title: 'Angular 10 Http Post Request Example'
      },
      {
        id: 2,
        title: 'Angular 10 Routing and Nested Routing Tutorial With Example'
      },
      {
        id: 3,
        title: 'How to Create Custom Validators in Angular 10?'
      },
      {
        id: 4,
        title: 'How to Create New Component in Angular 10?'
      }
    ];
  }
}

angular javascript web-development

Bootstrap 5 Complete Course with Examples

Bootstrap 5 Tutorial - Bootstrap 5 Crash Course for Beginners

Nest.JS Tutorial for Beginners

Hello Vue 3: A First Look at Vue 3 and the Composition API

Building a simple Applications with Vue 3

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

CRM Application | Angular Development | App Development

47% of corporations have 90% ready-made CRM adoption rate as it helps startups, SMEs, big brands in managing data, business relationships & grow business.

Why Web Development is Important for your Business

With the rapid development in technology, the old ways to do business have changed completely. A lot more advanced and developed ways are ...

Important Reasons to Hire a Professional Web Development Company

    You name the business and I will tell you how web development can help you promote your business. If it is a startup or you seeking some...

The Good and Bad of Angular Development

Today, we will gather some necessary information about Angular and know its pros and cons that can help you in deciding whether to use this framework for your next project or not.