main project : https://sourceforge.isae.fr/git/nanospace source : https://sourceforge.isae.fr/git/nanospace-angular-ui
npm install --save ngx-nanospace-client-lib
Import the project and add NgxNanospaceClientLibModule. Configure the nanospace server 'http://youServerNanospace/' or an other ip where your service is used. Think to end the ip with a '/'... Here an example of the
/* app.module.ts*/
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import {NgxNanospaceClientLibModule} from 'ngx-nanospace-client-lib';
import { AppComponent } from './app.component';
import {FormsModule} from '@angular/forms';
const config = {
endpoint: 'http://localhost:8888/'
};
@NgModule({
declarations: [
AppComponent,
...
],
imports: [
BrowserModule,
NgxNanospaceClientLibModule.forRoot(config),
FormsModule,
...
],
providers: [...],
bootstrap: [AppComponent]
})
export class AppModule { }
services are also existing you can add them in providers
...
import {NgxNanospaceClientLibModule, NanospaceRequestService, NanospaceService} from 'ngx-nanospace-client-lib';
...
providers: [
NanospaceRequestService,
NanospaceService
]
...
A form component is available to import data into nanospace
/*app.component.html*/
<nano-input-id [(ngModel)]="idImported"></nano-input-id>
<nano-input-value [(ngModel)]="valueImported"></nano-input-id>
<nano-import-export-value [(ngModel)]="valueImported"></nano-import-export-value>
/* app.component.ts*/
import {Component, OnInit} from '@angular/core';
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
constructor() {}
valueImported = '';
idImported = ''
ngOnInit(): void {
}
}
Service can also be imported to be use to made a request
export class AppComponent implements OnInit {
constructor(private nanospace: NanospaceService) {}
valueImport = '';
ngOnInit(): void {
this.nanospace.login({username: 'usrLogin', password: 'usrPw'}).subscribe(() => {
this.nanospace.getProjectList().subscribe((pList: ProjectModel[]) => {
console.log(pList);
});
});
}
}
There is some problem in table of values display. The text exceed the modal windows.
You may have to install bootstrap in your module to use InputValueComponent ()
npm i bootstrap
You may have to install the following dependecies
npm i @fortawesome/angular-fontawesome @fortawesome/fontawesome-svg-core @fortawesome/free-solid-svg-icons @ng-bootstrap/ng-bootstrap
/*angular.json*/
"architect": {
"build": {
...
"styles": [
...
"node_modules/bootstrap/dist/css/bootstrap.min.css"
],
...