Reputation: 16723
If I have the Component class
@Component({
selector: 'my-app',
templateUrl: './app.component.html',
styleUrls: [ './app.component.css' ]
})
export class AppComponent implements OnInit {
}
and index.html is
<div>
<my-app></my-app>
</div>
What would be the host element of the component? Would it be <div>
or <my-app>
? If it is <my-app>
, is there a way to get access to the <div>
(parent of AppComponent
) from AppComponent
?
Upvotes: 9
Views: 7255
Reputation: 16723
For Directive, it is the element the directive is attached to. Eg h1
is the host element in below example
<h1 my-directive>
</my-comp>
For component, it is the selector of the component. Eg
selector: 'my-comp'
template: '
<h1> some heading </h1>
.....
<my-comp></my-comp> <!-- my-comp is the host element of h1 -->
Upvotes: 20