Доступ к полю HTML родительского компонента в компоненте библиотеки - PullRequest
Новая
       10

Доступ к полю HTML родительского компонента в компоненте библиотеки

0 голосов
/ 30 августа 2018

Я создал библиотеку Angular 6 с помощью команды 'ng generate library'. Эта библиотека используется в моем базовом компоненте после сборки --prod, а затем импортируется в app.module.ts основного приложения. Файл компонента ... в библиотеке имеет @Input("leftPanel") leftPanel: ElementRef;

Элемент HTML Div на base.component.html выглядит следующим образом: <div #leftPanel></div> И элемент библиотеки, используя его селектор:
<lib-ng-mylibrary [leftPanel]="leftPanel"> </lib-ng-mylibrary>

Компонент библиотеки реализует AfterViewInit. В методе реализации выполнение этого кода завершается ошибкой: this.leftPanel.nativeElement.style.flexBasis = '50%'; это говорит, что this.leftPanel.nativeElement не определен. Но я вижу, что this.leftPanel указывает на div. Интересно, почему это не разрешает this.leftPanel.nativeElement`, даже если @Input leftPanel имеет тип ElementRef?

Заранее спасибо!

1 Ответ

0 голосов
/ 30 августа 2018

Harshad

Вместо отправки родителя ElementRef я чувствую, что ваш компонент должен иметь и @Output и инициировать событие, обрабатываемое родителем, для изменения собственной ширины панели.

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

См. Документы здесь: https://angular.io/guide/component-interaction

Все еще хотите использовать ElementRef в качестве параметра

Если вы все еще хотите отправить leftPanel в качестве параметра, вам понадобится также переменная @Input () в вашем основном компоненте, чтобы она могла преобразовать <div #leftPanel> в локальную переменную, и эта переменная будет использоваться в [leftPanel]="leftPanel"

ура

...