0

コードで操作できるように、Angular 2 コンポーネントのテンプレートで定義された特定の DOM 要素のハンドルを取得する必要があります。jQuery と ElementRef は使用したくありませんが、使用する必要がある要素を参照するためにテンプレート自体で定義できる変数を使用したいと考えています。「私のコンポーネント」に挿入する「内部コンポーネント」を使用して、目標を達成できました。「内部コンポーネント」で入力プロパティを定義し、テンプレート変数をこのプロパティにバインドします。そうしたら、「内部コンポーネント」のコードでDOM要素を使用できます。同じ結果に到達するためのより簡単な方法があると確信しています。誰でもアドバイスできますか?ここに私が何をするかを説明するサンプルコードがあります。前もって感謝します

import {Component} from 'angular2/core';

import {MyInnerComponent} from './myInnerComponent';

@Component({
  selector: 'my-component',
  template: `
    <div #thisElement id="thisElement">
        <my-inner-component [element]="thisElement"></my-inner-component>
    </div>
  `,
  directives: [MyInnerComponent]
})

export class MyComponent { 

} 


import {Component, OnInit, Input} from 'angular2/core';

@Component({
  selector: 'my-inner-component',
  template: `
  `,
    inputs: ['element'],
})

export class MyInnerComponent implements OnInit { 
    @Input() element: any;

    ngOnInit() {
        console.log(this.element);
    }
}
4

1 に答える 1

0

AfterViewInitとを使用できます。ViewChildここにデモがあります。

于 2016-01-04T01:00:50.313 に答える