Как автоматически проскролить до таблицы?

Алексей Зуев: проект в меру большой, проект на ~ 5.4 Мб при build --prod

Как автоматически проскролить до таблицы?

Алексей Зуев: я тут для оповещений делаю запрос через каждые 10 сек. (пока web-сокеты не поднял). Тоже через setTimeout(). Очень плохо?)

Как автоматически проскролить до таблицы?

Алексей Зуев: что-то я разницы не увидел, то ли не понял )

В какой тег кинуть шрифтовую иконку?

AlexKeller: перегибаете. Не нужно поднимать холивар из-за того что у кого-то мнение не схоже с Вашим. Мы тут, чтобы помочь автору вопроса и пишем лишь своё мнение на этот счет

В какой тег кинуть шрифтовую иконку?

AlexKeller: если можно сэкономить 600 байт, 10 байт, почему бы этого не сделать? Хоть на доли секунды но ускорить загрузку? Я не "говорю", что именно для этого используется, но всё же...

В какой тег кинуть шрифтовую иконку?

riot26: да, в этом Вы правы

В какой тег кинуть шрифтовую иконку?

twobomb: да, Вы правы. Меньше размер документа, хоть и не значительно но всё же ))

Есть ли смысл использовать формы?

yurygolikov: правильно написал. Просто дополню, что авторизацию и регистрацию лучше кидать на чистый рендеринг backend. Зачем человеку который случайно зашел на сайт, или просто хочет зарегистрироваться грузить весь проект. Ну и от тэга form не нужно отказываться, хотя бы ради того, что пробегаясь глазами по коду сразу видно где форма работающая с backend, а где просто input, select или другое, что дают некую обработку на "фронте"

Как автоматически проскролить до таблицы?

Алексей Зуев:

Запустите это вне ангуляровской зоны

А это как, не подскажите?

Как автоматически проскролить до таблицы?

Алексей Зуев: Вот так у меня ячейки расходятся) - Plunker

Как автоматически проскролить до таблицы?

Алексей Зуев: Сделал скролл до таблицы с анимацией)) - Plunker

Как автоматически проскролить до таблицы?

Алексей Зуев: понял почему расползаются ячейки. Такое работает только при table-layout: fixed; когда все ячейки одного размера. В моем же случае все ячейки разной ширины. Блин :)

Как автоматически проскролить до таблицы?

Алексей Зуев: ячейки расползаются)) ну это ладно, сам разберусь, там в стилях что-то. Спасибо большое))
Кстати, немного переписал Ваш вариант директивы ScrollToMeDirective. У меня сверху toolbar высотой 56px, и нужно было, чтобы блок не заходил за него, а scrollIntoView не дает возможности манипулировать с высотой. Получилось вот так:

window.scrollTo(0, this.elRef.nativeElement.getBoundingClientRect().top + pageYOffset - 56);

Хорошо?)

Как автоматически проскролить до таблицы?

Алексей Зуев: Plunker

Как автоматически проскролить до таблицы?

Алексей Зуев: сейчас подготовлю )

Как автоматически проскролить до таблицы?

Алексей Зуев: там фишка в том, что:

@HostBinding('style.width') get width() {
        return this.fixed ? this.el.parentNode.offsetWidth + 'px' : 'auto';
    }

Добавляет style.width в p-datatable. А нужно в tr которая в thead, потому что иначе граница справа уходит до самого края ))

Как автоматически проскролить до таблицы?

Алексей Зуев: да, есть класс ui-datatable-thead для thead, но если применять к нему есть один баг интересный. Если начать прокручивать страницу по тихоньку, то начнется бесконечный цикл добавления/удаления класса fixed :D
А вот для tr которая в thead > tr, ну или .ui-datatable-thead > tr, такого бага не обнаружилось

Как автоматически проскролить до таблицы?

Алексей Зуев: вот такое обсуждение нужно в том вопросе и выбор Вашего ответа :)

Алексей Зуев: кстати, что-то туплю, не могу передать fixed и width (главное width) для "thead > tr", потому что пока не разобрался полностью в dattable от material design, использую datatable от primang, и у них вставка таблицы такая:

<p-dataTable>
  <p-column [header]="Test 1" [field]="'test1'"></p-column>
  <p-column [header]="Test 2" [field]="'test2'"></p-column>
</p-dataTable>

И тут я могу fixedHeader прикрепить только к , а width нужно для tr назначить, которая в thead находится :)

Как автоматически проскролить до таблицы?

Алексей Зуев: а, я кстати взял Вашу идею за основу и переписал немного. Я решил вместо передачи целой группы передавать только контрол

<clockpicker [placeholder]="'Время #1'" [control]="form.controls['time1']"></clockpicker>
<clockpicker [placeholder]="'Время #2'" [control]="form.controls['time2']"></clockpicker>

В самом компоненте clockpicker:

<md-input-container>
  <input mdInput type="text" [formControl]="control" [placeholder]="placeholder">
  <span mdSuffix><md-icon>access_time</md-icon></span>
  <md-error *ngIf="control.hasError('required')">Обязательное поле</md-error>
  <md-error *ngIf="control.hasError('validateTime')">Неправильное время</md-error>
</md-input-container>

Как автоматически проскролить до таблицы?

Алексей Зуев: да да, он самый