Все сервисы Хабра

Сообщество IT-специалистов

Ответы на любые вопросы об IT

Профессиональное развитие в IT

Удаленная работа для IT-специалистов

Войти на сайт
  • Все вопросы
  • Все теги
  • Пользователи

Хабр Q&A — вопросы и ответы для IT-специалистов

Получайте ответы на вопросы по любой теме из области IT от специалистов в этой теме.

Узнать больше
другие проекты хабра
  • Хабр
  • Карьера
  • Фриланс
Задать вопрос
StivinKing

Ivan Stroykin

  • 148
    вклад
  • 71
    вопрос
  • 113
    ответов
  • 100%
    решений
Ответы
  • Информация
  • Ответы
  • Вопросы
  • Комментарии
  • Подписки
  • Нравится
  • Достижения
  • Как реализовать форму со списком чекбоксов как один control в Angular 6?

    StivinKing
    Ivan Stroykin @StivinKing
    Как то так? - https://stackblitz.com/edit/angular-2oejmz
    Идея взята отсюда
    Ответ написан более двух лет назад
    Комментировать
    Нравится Комментировать
  • Как поставить драйвера на сетевую карту Intel i219V?

    StivinKing
    Ivan Stroykin @StivinKing Автор вопроса
    В общем, решить проблему помогли ребята с телеграмм канала Debian

    Подключиться по USB к Android и раздать тем самым интернет
    После этого воспользоваться данной инструкцией - ссылка
    Выполнить обновление:
    apt update && apt -y upgrade && apt -y dist-upgrade

    Перезагрузиться и всё работает
    Ответ написан более двух лет назад
    Комментировать
    Нравится Комментировать
  • Как сделать таймер обратного отчета?

    StivinKing
    Ivan Stroykin @StivinKing
    Пример реализации: stackblitz
    Ответ написан более двух лет назад
    Комментировать
    Нравится 1 Комментировать
  • Как получить html элемент из ngFor Angular 2+?

    StivinKing
    Ivan Stroykin @StivinKing
    Как то так - ссылка
    Ответ написан более двух лет назад
    1 комментарий
    Нравится 1 1 комментарий
  • Как в Angular 5 сделать такой слайдер цены?

    StivinKing
    Ivan Stroykin @StivinKing
    Issues в репозитории angular/material2 по поводу Range Slider - ссылка
    Как понятно по ответам, данный функционал пока не планируется добавлять

    Pull request по добавлению Range Slider - ссылка
    Можете просто на основе реализации автора сделать свой range slider
    Ответ написан более двух лет назад
    1 комментарий
    Нравится 1 комментарий
  • Почему при отключенной стратегии onPush не срабатывает хук OnChanges()?

    StivinKing
    Ivan Stroykin @StivinKing
    Ссылка на ваш объект не меняется. Хук OnChanges срабатывает только первый раз в обоих примерах и более не срабатывает, так как ссылка на объект не меняется, так как это всё тот же самый объект, даже если содержимое объекта изменилось. Во втором случае перерисовывается шаблон, потому что отключена стратегия onPush. Чтобы при стратегии onPush обрабатывались изменения объекта есть 2 варианта: создать новый объект или воспользоваться хуком DoCheck и самим прописать логику обнаружения изменения.
    Ответ написан более двух лет назад
    Комментировать
    Нравится 1 Комментировать
  • Почему не срабатывает OnChanges-хук?

    StivinKing
    Ivan Stroykin @StivinKing
    Хук OnChanges не отрабатывает на объект, так как ссылка на объект не меняется. Это всё тот же самый объект, даже если содержимое объекта изменилось. Чтобы данный хук отработал, нужно создать новый объект или воспользоваться хуком DoCheck и самим прописать логику обнаружения изменения

    Вот пример - ссылка
    Ответ написан более двух лет назад
    Комментировать
    Нравится 1 Комментировать
  • Как правильно настроить фильтр вывода информации по дате для определенного пользователя?

    StivinKing
    Ivan Stroykin @StivinKing
    А как вы хотели, если после выбора пользователя и выбора года вы фильтруете список только по одной из сущностей?
    Напишите отдельный метод, который будет фильтровать, что-то вроде:
    public onSelectedUser(userId: number) {
        this.selectedUser = userId;
        this._filtered(this.selectedUser, this.selectedYear);
      }
    
      public onSelectedYear(year: number): void {
        this.selectedYear = year;
        this._filtered(this.selectedUser, this.selectedYear);
      }
    
      private _filtered(userId: number, year: number): void {
        let filteredNotes = this.notes;
        if (userId) {
          filteredNotes = filteredNotes.filter(note => note.user_id === userId);
        }
        if (year) {
          filteredNotes = filteredNotes.filter(note => note.year === year);
        }
        this.filteredNotes = filteredNotes;
      }
    Ответ написан более двух лет назад
    3 комментария
    Нравится 3 комментария
  • Как получить токен из заголовка?

    StivinKing
    Ivan Stroykin @StivinKing
    Используйте HttpClientXsrfModule
    Ответ написан более двух лет назад
    Комментировать
    Нравится 2 Комментировать
  • Как пропустить пуст к роуту /en /ru Angular 2+?

    StivinKing
    Ivan Stroykin @StivinKing
    Накидал мини пример, надеюсь концепция будет ясна - ссылка
    Если язык не найден, то выкидываем на страницу 404, в данном примере просто вывожу в информацию в консоль
    Ответ написан более двух лет назад
    18 комментариев
    Нравится 18 комментариев
  • Как пишутся динамические многопользовательные игры на html5?

    StivinKing
    Ivan Stroykin @StivinKing
    Вот вам пример реализации игры на двоих - ссылка используя Angular и Pusher
    Ответ написан более двух лет назад
    2 комментария
    Нравится 3 2 комментария
  • Есть сервис Аутификации. Как сделать его общим для всего проекта?

    StivinKing
    Ivan Stroykin @StivinKing
    У вас будет AuthGuard, который будет контролировать доступ к разделам и можно написать директиву, которая будет контролировать показ UI на странице. Пусть директива будет называться, к примеру, "hasAuth" и будет иметь такое содержимое:
    @Directive({ selector: '[hasAuth]' })
    export class HasAuthDirective implements OnInit {
      constructor(private _viewContainer: ViewContainerRef, private _template: TemplateRef<any>) { }
    
      ngOnInit(): void {
        this._checkAuth(/*ваше определение аутентификации типа boolean*/);
      }
    
      private _checkAuth(isAuth: boolean): void {
        if (isAuth) {
          this._viewContainer.createEmbeddedView(this._template);
        } else {
          this._viewContainer.clear();
        }
      }
    }

    И в шаблоне, где нужно показать/скрыть кнопку или другой UI в зависимости от того, прошел ли пользователей аутентификацию, просто добавляем созданную нами директиву:
    <button *hasAuth>Редактировать статью</button>

    Набросал мини пример - ссылка

    Что касается "локализации". Так же нет ничего сложного. Рекомендую использовать ngx-translate. В принципе, там есть вся необходимая информация по вопросам "как этим пользоваться".
    Ответ написан более двух лет назад
    5 комментариев
    Нравится 1 5 комментариев
  • Парсинг результата в Angular 5+, как правильно?

    StivinKing
    Ivan Stroykin @StivinKing
    Опишите Http Interceptor, который будет перехватывать ответ, проделывать манипуляции и отдавать уже в нужном вам формате. Примеры можно найти, загуглив: "angular 5 http interceptor response"
    Ответ написан более двух лет назад
    Комментировать
    Нравится 3 Комментировать
  • Логично ли использовать сервис в сервисе?

    StivinKing
    Ivan Stroykin @StivinKing
    Используйте для этого Http Interceptor. Примеров использования в сети большое количество
    Ответ написан более двух лет назад
    Комментировать
    Нравится 1 Комментировать
  • Как при клике на кнопку менялся цвет у одного из 3х элементов?

    StivinKing
    Ivan Stroykin @StivinKing
    Пример. Далее можете улучшить
    Ответ написан более двух лет назад
    4 комментария
    Нравится 1 4 комментария
  • Что за адрес blob: в ссылке видео?

    StivinKing
    Ivan Stroykin @StivinKing
    Ответ на ваш вопрос
    Ответ написан более двух лет назад
    Комментировать
    Нравится 1 Комментировать
  • Angular 5 JWT где хранить роли пользователя? Каким образом проверять?

    StivinKing
    Ivan Stroykin @StivinKing
    Есть несколько вариантов. Но какой бы способ вы не использовали, всё что на фронте, может передать под себя, и открыть те же недоступные кнопки, которые не подходят под роль. Поэтому всегда нужно делать проверку на бэке

    Из вариантов, это хранение в куках, глобально в сервисе, в нужных местах делать запрос на back и получать разрешение или запрет. Самое главное еще не передавать никогда список ролей. Никто не должен знать какие роли существуют.

    Можно написать директиву, вроде:
    Директива по отображению элементов в интерфейсе в зависимости от роли
    @Directive({ selector: '[hasRole]' })
    export class HasRoleDirective implements OnInit {
      @Input() hasRole: string[] | string | undefined;
    
      constructor(private _viewContainer: ViewContainerRef,
                  private _template: TemplateRef<any>) {
      }
    
      ngOnInit(): void {
        this._checkRoles(GlobalService.userRole);
      }
    
      private _checkRoles(userRole: string): void {
        if (!this.hasRole || this.hasRole === 'undefined' || this.hasRole.indexOf(userRole) !== -1) {
          this._viewContainer.createEmbeddedView(this._template);
        } else {
          this._viewContainer.clear();
        }
      }
    }


    Можете переписать данную директиву под себя. То есть при открытии страницы делать запрос на backend получать разрешение/запрет на просмотр элементов и с помощью этой директивы, расставленной на определенные элементы, контролировать отображение
    Ответ написан более двух лет назад
    Комментировать
    Нравится 1 Комментировать
  • Как применить formControlName к input?

    StivinKing
    Ivan Stroykin @StivinKing
    На основе вашего примера - ссылка. Пример с ControlValueAccessor и добавил пример с FromGroup (файл input-control.component.ts)
    Ответ написан более двух лет назад
    1 комментарий
    Нравится 3 1 комментарий
  • Как отображать меню в зависимости от роли пользователя?

    StivinKing
    Ivan Stroykin @StivinKing
    Есть несколько вариантов, которые приходят в голову. Но так как отличие "account" и "admin" чаще всего не заканчивается один лишь только меню, считаю, что лучше всего подойдут обертки.

    Для начала у нас есть 2 разных компонента меню, для разделов "account" и "admin". Пусть будут называться "app-user-menu" и ""
    К примеру, создаем в /shared/layout/wrapper 2 компонента (обертки): user-wrapper и admin-wrapper
    <!-- User Wrapper -->
    <header></header>
    <app-user-menu></app-user-menu>
    <main>
      <router-outlet></router-outlet>
    </main>
    <footer><footer>
    
    <!-- Admin Wrapper -->
    <app-admin-header></app-admin-header>
    <app-admin-menu></app-admin-menu>
    <main>
      <router-outlet></router-outlet>
    </main>
    <footer><footer>

    И в роутах оборачиваем дочерние компоненты в наши обертки
    // routing
    export const routes: Routes = [
      { path: 'account', component: UserWrapperComponent, children: [ ... ] }.
      { path: 'admin', component: AdminWrapperComponent, children: [ ... ] }
    ];

    В итоге можно сделать полностью отличающуюся структуру для разных роутов. Добавляем на "admin" AuthGuard и вот уже доступ к разделу имеют только авторизованные пользователи
    Ответ написан более двух лет назад
    1 комментарий
    Нравится 1 1 комментарий
  • Какую UI либу обычно юзают для интерфейсов в ангуляре?

    StivinKing
    Ivan Stroykin @StivinKing
    На официальном сайта в разделе resources - ссылка, если прокрутить немного ниже, есть пункт UI Components с хорошими ссылками
    Ответ написан более двух лет назад
    Комментировать
    Нравится 2 Комментировать
Оценили как «Нравится»
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • Следующие →
Самые активные сегодня
  • Forwatters
    Forwatters
    • 9 ответов
    • 0 вопросов
  • firedragon
    Владимир Коротенко
    • 9 ответов
    • 0 вопросов
  • opium
    Пума Тайланд
    • 8 ответов
    • 0 вопросов
  • Василий Банников
    • 7 ответов
    • 0 вопросов
  • yupiter7575
    Yupiter7575
    • 7 ответов
    • 0 вопросов
  • TNPTSYWWCC
    Uneasy Hearts Weigh the Most
    • 6 ответов
    • 0 вопросов
  • © Habr
  • О сервисе
  • Обратная связь
  • Блог

Войдите на сайт

Чтобы задать вопрос и получить на него квалифицированный ответ.
Войти через центр авторизации