Angular 6 динамических данных изменения - PullRequest
0 голосов
/ 15 апреля 2019

Пожалуйста, помогите мне понять, На стороне клиента приложения у меня есть компонент, который показывает информацию таблицы пользовательских данных.Если данные на стороне сервера были изменены, обновления должны отображаться на стороне клиента (добавить некоторые элементы в таблицу или удалить).Как я могу сделать это динамически?

Ответы [ 2 ]

0 голосов
/ 15 апреля 2019

Для этого у вас есть два решения, первое - создать веб-сервис, который извлекает данные каждый период времени, например, 10 секунд.Второй способ, более достаточный способ, вы можете использовать веб-сокет между двумя сторонами приложения.

0 голосов
/ 15 апреля 2019

Один из подходов состоит в том, чтобы подписаться на функцию, которая получает данные с вашего сервера, и обновлять данные на стороне клиента в случае каких-либо изменений.

Функция, подобная этой, будет запрашивать конечную точку на стороне сервера:

GetServerData() {
    return this.http.get('your_endpoint_url').pipe(
        map(response => {
            return response;
        })
    );
}

Затем вы подпишетесь на эту функцию:

this.GetServerData().subscribe(response => {
    console.log(response)
    // Fires if new data is received from the server. Use response to update your client side data table
});

Если вы хотите постоянно проверять изменения на стороне сервера, вы можете использовать интервальный таймер (возможно, в конструкторе компонентов или другом хуке жизненного цикла).) для периодического запуска GetServerData (), как предлагает M.Ismail например:

setInterval(this.GetServerData, 5000);

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

В зависимости от объема данных вы можете проверить, было ли изменение, а затем обновить пользовательский интерфейс, если он есть, или просто обновить пользовательский интерфейс с последнейпакет данных, независимо от того, изменился ли он.

Если честно, если вам нужна очень тесная ссылка, какВ связи между клиентской и серверной сторонами могут быть более эффективные решения, которые снова M.Ismail предложил в своем ответе.Но это один из методов, если вы просто хотите использовать Angular.

...