As a PHP programmer new to Angular, I am facing an issue while trying to retrieve user properties from a Laravel API. When attempting this, I encountered the following error:
compiler.js:1021 Uncaught Error: Unexpected value 'UserService' imported by the module 'UserModule'. Please add a @NgModule annotation.USERCOMPONENT
import { Component, OnInit, Input } from '@angular/core';
import { User} from './user';
import { UserService } from './user.service';
@Component({
selector: 'app-user',
templateUrl: './user.component.html',
styleUrls: ['./user.component.css']
})
export class UserComponent implements OnInit {
users: User[]
constructor(private userService: UserService) {
}
ngOnInit() {
this.listarUsuarios();
}
listarUsuarios(): void{
this.userService.listaUsararios().subscribe(users => this.users = users);
}
}
USERSERVICE
import { HttpClient } from "@angular/common/http";
import { Injectable } from "@angular/core";
import { Observable } from "rxjs";
import { User } from "./user";
const API = 'http://localhost:8000/api/user/users';
@Injectable({ providedIn: 'root' })
export class UserService {
constructor(private http: HttpClient) {
}
listaUsararios(): Observable<User[]> {
return this.http.get<User[]>(API);
}
}
I have attempted to import the service here, but I believe that it is already being imported in UserModule and hence not required here. USERMODULE
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { HttpClientModule} from '@angular/common/http';
import { UserComponent} from './user.component';
@NgModule({
declarations: [
UserComponent,
],
imports: [
CommonModule,
HttpClientModule
],
exports:[
UserComponent,
]
})
export class UserModule { }
USERINTERFACE
export interface User {
id: number,
name:string,
email: string,
telefone:string
datascimento: Date,
}
Can someone help me with this issue?