Ajax-вызов углового приложения возвращает ошибку 404 на существующем маршруте - PullRequest
0 голосов
/ 03 февраля 2019

Я работаю над библиотекой интернационализации для angular, и я хотел бы создать угловой компонент, который возвращает все переводы для данного языка.Просто для тестирования я создал следующий TranslateComponent

import {Component} from '@angular/core';

@Component({
    selector: 'trans-translate',
    templateUrl: './translate.component.html'
})
export class TranslateComponent {
    // region Public fields
    public data: string[] = ['This', 'is', 'Sparta'];
    // endregion
}

с простым html-шаблоном с отображением данных:

{{ data | json }}

URL для доступа к этому компоненту: http://localhost:4200/translateи если я получаю к нему доступ из браузера, все работает хорошо (у меня следующий результат: ["This", "is", "Sparta"]]. Проблема в том, что я хочу вызвать его с HttpClient, и там он не работаетЯ только что сделал этот простой тест:

import {Component, OnInit} from '@angular/core';
import {HttpClient} from '@angular/common/http';

@Component({
    selector: 'app-page-test',
    templateUrl: './test-page.component.html'
})
export class TestPageComponent implements OnInit {
    // region Constructor
    public constructor(
        private readonly _HTTP: HttpClient
    ) {}
    // endregion

    // region Public methods
    public ngOnInit(): void {
        this._HTTP.get('/translate').subscribe((result: any): void => {
            console.log(result);
        });
    }
    // endregion
}

Но все, что я получаю, это ошибка 404 с телом:

<code><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Error</title>
</head>
<body>
<pre>Cannot GET /translate

И я не могу понять, что мне не хватает? Это заголовок, который я должен добавить к запросу?

Для записи я на самом деле использую Angular 7, и я запускаю сервер с командой "npm run start ", который просто выполняет команду" ng serve ".

1 Ответ

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

Перевести и проверить два компонента.localhost: 4200 / translate на самом деле является компонентом и показывает данные.

В то время как на тестовой странице вы пытаетесь вызвать службу с помощью HttpClient.Он не будет вызывать компонент translate и возвращать вам данные.

Надеюсь, это то, что вы имели в виду, когда упомянули, что

это страница localhost: 4200 / test делает запрос к localhost: 4200 / перевод, так что я почему бы это проблема

...