次のコードでは
<input #myRef1 />
<input #myRef2 my-custom-attribute />
#myRef1
なりElementRef
、そして#myRef2
なりますMyCustomAttributeComponent
ディレクティブ。基本的に、最初のコンポーネントを暗黙的に見つけて、それをテンプレート参照変数に関連付けます。おかげでexportAs
、どのディレクティブ/コンポーネントが必要かを強制できますが、ここではElementRef
、どちらの場合も実際に必要です。
力にそこに何かがある#myRef2
ことをElementRef
なし活字体@ViewChild(..., { read: ElementRef })
。私がアクセスする必要myRef2
のようにElementRef
私のテンプレートインチ
ElementRefサービスをディレクティブに挿入し、次のようにテンプレートで挿入されたサービス参照にアクセスします
component.html
<input #ref="custom" type="text" appCustom>
{{ref.template}}
ディレクティブ.ts
import { Directive, ElementRef } from '@angular/core';
@Directive({
selector: '[appCustom]',
exportAs: 'custom'
})
export class CustomDirective {
constructor(public template:ElementRef) { }
}
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加