Stack Exchange
Does this approach have a chance, when I use instance of parent component as property of child component?
I tried to use instance of parent component in child component via constructor. In other words, I create instance of parent component class as private property and use its properties, methods etc.
Besides that, I can affect to values of parent component properties directly without using Input, Output decorators, event listeners etc.
Parent
@Component({
  selector: 'parent-component',
  templateUrl: './parent-component.component.html',
  styleUrls: ['./parent-component.component.scss']
})

export class ParentComponent implements OnInit {

  someParentProperty: number = 10;
  
  constructor() {}
  
  ngOnInit() {}
  
  someParentMethod = (num) => num**2;
}

Child
import { ParentComponent } from '../parent-component';

@Component({
  selector: 'child-component',
  templateUrl: './child-component.component.html',
  styleUrls: ['./child-component.component.scss']
})

export class ChildComponent implements OnInit {

  someChildProperty: number;
  
  constructor(pc: ParentComponent) {}
  
  ngOnInit() {
    this.someChildProperty = this.pc.someParentMethod(this.pc.someParentProperty);
  }  
  
}

That's rather comfortable, but I'm not sure, that it's a best practice and right approach.
Could someone explain minuses of this one?

"I'm not sure, that it's a best practice": it is not. What's the point of defining a parent component if you end up using it as a child component? "I can affect to values of parent component properties directly without using Input, Output decorators, event listeners": and how would this be beneficial? You're just breaking single responsability and encapsulation. Input / output decorators exist in Angular exactly for handling parent/child communication while preserving the principles of a component-based design.

you should use Host :  constructor(@Host() private pc:ParentComponent){} else you're inject a "component", but not the parent else a new instance. And not, it's not a "best practice" in general. It's used in concrete cases, e.g. a slide in a carousel, a submenu in a menu... in these case there're a strong dependency between parent and children, but even in this cases you should think if it's better use Output, Input or another way to comunicate to maintain separate the concepts.



What's the point of defining a parent component if you end up using it as a child component?


If I have a few child components, I'll use parent properties and methods for working with them and not redefine its in each ones, for example.

Why don't you use a service?
So that you can access your required method from both child and parent components.
E.g: A common service:
@Injectable({
 providedIn: 'root',
})
export class CommonService {
    someParentMethod(num) { 
        return num**2;
    }
}

At ParentComponent:
export class ParentComponent implements OnInit {
    constructor(private commonService: CommonService) {}

    ngOnInit() {
        console.log(commonService.someParentMethod(2));
    }
}

You can do the same at ChildComponent you can do the same.
It's the best way for sharing.
You can find detail about services here.

Thanks, I know about shared servises, but my question is about other.
