When I access the URL to my Api:
Angular service:
import { Injectable } from '@angular/core';
import { Code } from './home/Code';
import { Observable } from 'rxjs/Observable';
import { of } from 'rxjs/observable/of';
import { catchError, map, tap } from 'rxjs/operators';
import { HttpClient, HttpHeaders } from '@angular/common/http';
@Injectable()
export class HomeService {
private codesUrl = '/apiv1.0/home';
constructor(
private httpClient: HttpClient
) { }
getCode(code: String): Observable<Code> {
const url = '${this.codesUrl}/${code}';
console.log(url);
return this.httpClient.get<Code>(url)
.pipe(
tap(_ => this.log('fetched code - code=${code}')),
catchError(this.handleError<Code>('getCode code=${code}'))
);
}
private log(message: string) {
console.log('CodeService: ' + message);
}
/**
* Handle Http operation that failed.
* Let the app continue.
* @param operation - name of the operation that failed
* @param result - optional value to return as the observable result
*/
private handleError<T> (operation = 'operation', result?: T) {
return (error: any): Observable<T> => {
// TODO: send the error to remote logging infrastructure
// console.error(error); // log to console instead
// TODO: better job of transforming error for user consumption
this.log('${operation} failed: ${error.message}');
// Let the app keep running by returning an empty result.
return of(result as T);
};
}
}
app-routing.module.ts:
import { NgModule } from '@angular/core';
import { RouterModule, Routes } from '@angular/router';
import { HomeComponent } from './home/home.component';
const routes: Routes = [
{ path: 'home', component: HomeComponent },
{ path: '', redirectTo: 'home', pathMatch: 'full'} // default route
];
@NgModule({
imports: [
RouterModule.forRoot(routes)
],
exports: [ // exports RouterModule
RouterModule
]
})
export class AppRoutingModule { }
In ExpressJS. index.js:
const express = require('express');
const path = require('path');
const http = require('http');
const formidable = require('express-formidable');
const morgan = require('morgan');
var mongoose = require("mongoose");
// Get our API routes
const api = require('./routes/api_v1');
mongoose.connect("mongodb://localhost/app_test", { useMongoClient: true });
mongoose.Promise = global.Promise;
const app = express();
// static files
app.use(express.static(path.join(__dirname, 'public/dist')));
// middlewares
app.use(morgan('dev'));
app.use(formidable({ encoding: 'utf-8', keepExtensions: true}));
// Catch all other routes and return the index file
app.get('*', (req, res) => {
res.sendFile(path.join(__dirname, 'public/dist/index.html'));
});
// Set our api routes
app.use('/apiv1.0', api);
//Set Port
const port = process.env.PORT || '8080';
app.set('port', port);
const server = http.createServer(app);
server.listen(port, () =>
console.log('Running on localhost:${port}')
);
My Api. ApiV1.0:
const express = require('express');
const router = express.Router();
const Code = require('../models/code');
router.get('/', (req, res) => {
res.send('api works');
});
router.get('/home/:code', (req, res) => {
Code.find({codigo: req.params.code}, (err, codes) => {
if (err) {
return res.send();
}
res.json(codes);
});
});
module.exports = router;
When I try to send the data from the Front, I get this as a result from the Chrome console, which are printed in the getCode () method of home.service.ts: