Aurelia получает клиент, не получающий данные от контроллера - PullRequest
Новая
       19

Aurelia получает клиент, не получающий данные от контроллера

0 голосов
/ 18 февраля 2019

Я пытаюсь загрузить базу данных в контроллер (asp.net MVC), а затем использую клиент извлечения aurelia для загрузки данных из контроллера в представление, но aurelia не получает никаких данных (таблицы представления пустычто не является результатом при ручном объявлении массива входных данных)

EmployeesController (Controller) 

using Microsoft.AspNetCore.Mvc;
using SPAproject.Models;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;

namespace SPAproject.Controllers
{
    [Route("api/[controller]")]
    public class EmployeesController : Controller
    {
        private readonly EmployeesDbContext context;

        public EmployeesController(EmployeesDbContext context)
        {
            this.context = context;
        }

        [HttpGet]
        public IEnumerable<Employee> Get()
        {
            return context.Employees.ToList();
        }
    }
}

emp-api (где я получаю данные) 

import { HttpClient } from 'aurelia-fetch-client';
import { inject } from 'aurelia-framework';

let latency = 200;
let id = 0;


@inject(HttpClient)
export class EmpAPI {
    isRequesting = false;

    constructor(http) {
        this.http = http;
        this.http.configure(config =>
                            config.useStandardConfiguration()
                                    .withDefaults({
                                        mode: 'cors'
                                   }
                                 )
                             );
        this.employees = [];

        http.fetch('/api/Employees')
            .then(x => x.json())
            .then(employees => this.employees = employees);


    }

    getEmployeeList() {
        this.isRequesting = true;
        return new Promise(resolve => {
            setTimeout(() => {
                let results = this.employees.map(x => {
                    return {
                        id: x.id,
                        firstName: x.firstName,
                        lastName: x.lastName,
                        email: x.email
                    }
                });
                resolve(results);
                this.isRequesting = false;
            }, latency);
        });
    }

    getEmployeeDetails(id) {
        this.isRequesting = true;
        return new Promise(resolve => {
            setTimeout(() => {
                let found = this.employees.filter(x => x.id == id)[0];
                resolve(JSON.parse(JSON.stringify(found)));
                this.isRequesting = false;
            }, latency);
        });
    }

    saveEmployee(employee) {
        this.isRequesting = true;
        return new Promise(resolve => {
            setTimeout(() => {
                let instance = JSON.parse(JSON.stringify(employee));
                let found = this.employees.filter(x => x.id == employee.id)[0];

                if (found) {
                    let index = this.employees.indexOf(found);
                    this.employees[index] = instance;
                } else {
                    instance.id = getId();
                    this.employees.push(instance);
                }

                this.isRequesting = false;
                resolve(instance);
            }, latency);
        });
    }
}

список сотрудников (куда я пытаюсь получить данные из API) 

import { EventAggregator } from 'aurelia-event-aggregator';
import { EmpAPI } from 'emp-api';
import { inject } from 'aurelia-framework';
import { EmployeeUpdated } from 'employeeUpdated';
import { EmployeeViewed } from 'employeeViewed';

@inject(EmpAPI, EventAggregator)
export class EmployeeList {
    constructor(api, ea) {
        this.api = api;
        this.ea = ea;
        this.employees = [];

        ea.subscribe(EmployeeViewed, msg => this.select(msg.employee));
        ea.subscribe(EmployeeUpdated, msg => {
            let id = msg.employee.id;
            let found = this.employees.find(x => x.id == id);
            Object.assign(found, msg.employee);
        });
    }

    created() {
        this.api.getEmployeeList().then(employees => this.employees = employees);

    }

    select(employee) {
        this.selectedId = employee.id;
        return true;
    }
}

Ответы [ 2 ]

0 голосов
/ 19 февраля 2019

Проблема, которую вы видите, заключается в том, что вы не дождались возвращения данных.К моменту создания вашего элемента employee-list свойство employees в вашем EmpAPI еще не определено, поскольку ваш запрос на выборку данных еще не возвращен.

Я вижу, что у вас задержка 200 мсчтобы этого не случилось, но иногда, возможно, этого недостаточно (я подозреваю, что это).Может быть, вы можете попробовать другую задержку, если хотите сохранить эту стратегию?Есть разные способы сделать это, например, разрешить обещание getEmployeeList() только в том случае, если вызов извлечения данных уже разрешен, отложить вызов дальше, дождаться вызова и т. Д.

0 голосов
/ 19 февраля 2019

Либо вы можете использовать один из их методов-оболочек , например, http.get('/api/Employees').

Если вы хотите использовать fetch, вам нужно указать метод http.fetch('/api/Employees', {method: 'GET'})

...