Aurelia with an ASP.NET Core API

Author: elanderson

ASP.NET Core Basics/src/Aurelia/aurelia_project/aurelia.json

@@ -93,6 +93,7 @@
           "aurelia-bootstrapper",
           "aurelia-dependency-injection",
           "aurelia-event-aggregator",
+          "aurelia-fetch-client",
           "aurelia-framework",
           "aurelia-history",
           "aurelia-history-browser",

ASP.NET Core Basics/src/Aurelia/gulpfile.babel.js

@@ -1,4 +1,5 @@
-import gulp from 'gulp';
+/// <binding AfterBuild='bulid' />
+import gulp from 'gulp';
 import shell from 'gulp-shell';
 
 gulp.task('bulid', shell.task(['au build']));

ASP.NET Core Basics/src/Aurelia/src/app.js

@@ -1,5 +1,14 @@
+import { ContactService } from './services/contactService';
+
 export class App {
-  constructor() {
-    this.message = 'Hello World!';
-  }
-}
+    static inject() { return [ContactService] };
+
+    constructor(contactService) {
+        this.message = 'Hello World!';
+        contactService.GetAll()
+            .then(result => {
+                this.message = `Contact Results: 
+                                ${result.map((contact) => contact.name)}`;
+            });
+    }
+}

ASP.NET Core Basics/src/Aurelia/src/services/contactService.js

@@ -0,0 +1,21 @@
+import { HttpClient } from 'aurelia-fetch-client';
+
+export class ContactService {
+    static inject() { return [HttpClient] };
+
+    constructor(http) {
+        this.http = http;
+
+        this.http.configure(config => {
+            config
+                .useStandardConfiguration()
+                .withBaseUrl('http://localhost:13322/api/contactsApi/');
+        });
+    }
+
+    GetAll() {
+       return this.http.fetch('')
+            .then(response => response.json())
+            .catch(error => console.log(error));
+    }
+}

ASP.NET Core Basics/src/Aurelia/wwwroot/_references.js

@@ -12,12 +12,14 @@
 /// <reference path="../aurelia_project/tasks/process-css.js" />
 /// <reference path="../aurelia_project/tasks/process-markup.js" />
 /// <reference path="../aurelia_project/tasks/run.js" />
+/// <reference path="../aurelia_project/tasks/test.js" />
 /// <reference path="../aurelia_project/tasks/transpile.js" />
 /// <reference path="../gulpfile.babel.js" />
 /// <reference path="../src/app.js" />
 /// <reference path="../src/environment.js" />
 /// <reference path="../src/main.js" />
 /// <reference path="../src/resources/index.js" />
+/// <reference path="../src/services/contactservice.js" />
 /// <reference path="js/site.js" />
 /// <reference path="lib/bootstrap/dist/js/bootstrap.js" />
 /// <reference path="lib/jquery/dist/jquery.js" />
@@ -26,3 +28,4 @@
 /// <reference path="scripts/app-bundle.js" />
 /// <reference path="scripts/require.js" />
 /// <reference path="scripts/text.js" />
+/// <reference path="scripts/vendor-bundle.js" />