There was a bug, but it was fixed in the meantime. :host { } works fine now. Also supported are :host(selector) { … } for selector to match attributes, classes, … on the host element :host-context(selector) { … } for selector to match elements, classes, …on parent components selector /deep/ selector (alias selector >>> selector … Read more
You can do this by using @ViewChild for more info check this link With type selector child component @Component({ selector: ‘child-cmp’, template: ‘<p>child</p>’ }) class ChildCmp { doSomething() {} } parent component @Component({ selector: ‘some-cmp’, template: ‘<child-cmp></child-cmp>’, directives: [ChildCmp] }) class SomeCmp { @ViewChild(ChildCmp) child:ChildCmp; ngAfterViewInit() { // child is set this.child.doSomething(); } } With … Read more
No! There is no command which will change the name of all files generated using the component create command. So created ts, html, css/scss, .spec.ts files need to be manually renamed/edited. I am a frequent user of angular cli and I think this would be a nice-to-have command as some time we just create angular … Read more
Update – Newest Way Don’t do it, if you can avoid it. As Devon Sans points out in the comments: This feature will most likely be deprecated. Last Update From Angular 4.3.0 till even now (Angular 12.x), all piercing css combinators were deprecated. Angular team introduced a new combinator ::ng-deep as shown below, DEMO : … Read more
Instead of injecting ElementRef and using querySelector or similar from there, a declarative way can be used instead to access elements in the view directly: <input #myname> @ViewChild(‘myname’) input; element ngAfterViewInit() { console.log(this.input.nativeElement.value); } StackBlitz example @ViewChild() supports directive or component type as parameter, or the name (string) of a template variable. @ViewChildren() also supports … Read more
The hidden property can be used for that [hidden]=”!myVar” See also https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/hidden issues hidden has some issues though because it can conflict with CSS for the display property. See how some in Plunker example doesn’t get hidden because it has a style :host {display: block;} set. (This might behave differently in other browsers – I … Read more