Как я могу получить доступ к DOM в AngularDart?

Question

Как я могу получить доступ к DOM в AngularDart?

1

Я пытаюсь перенести некоторые элементы JavaScript Polymer в AngularDart.

Мне нужно иметь возможность сделать эквивалент this.$.contentContainer.getBoundingClientRect(); (для тех, кто не знаком с Polymer, который в основном является component.getElementById("contentContainer").getBoundingClientRect()).

Мне также нужно иметь доступ к элементу хоста для выполнения таких window.getComputedStyle(this).direction как window.getComputedStyle(this).direction где this элемент-хост.

Как такие вещи обычно делаются в AngularDart?

Kian Cross 01 авг. 2017, в 00:57

Источник

Теги:

angular

javascript

dart

polymer

angular-dart

2 ответа

Ещё вопросы

matanlurey · Answer 1 · 2017-07-31T23-03-00.000Z

Вы можете ввести объект под названием ElementRef:

import 'dart:html';

class Comp {
  final ElementRef _elementRef;

  Comp(this._elementRef) {
    final element = _elementRef.nativeElement as Element;
    element.getComputedStyle(); // ...
  }
}

В AngularDart 4.x мы разрешим вам вводить Element напрямую.

Günter Zöchbauer · Answer 2 · 2017-08-01T04-29-00.000Z

В качестве альтернативы вы можете получить ссылку на определенный элемент, используя @ViewChild()

@Component(
  selector: 'my-component',
  template: '''
<div #contentContainer></div>
'''
)
class MyComponent implements AfterViewInit {
  @ViewChild('contentContainer') ElementRef cc;

  ngAfterViewInit() {
    (cc.nativeElement as HtmlElement)....
  }
}

См. Также угловой 2/машинописный текст: возьмите элемент в шаблоне (который применим к Дарту с незначительными изменениями типа типов справа и необязательными параметрами в {})

Позволяет ли это вам получить элемент host тоже?
Если вам нужен элемент host, используйте метод, показанный @matanlurey