[SOLVED] Component selector always needed?

I just created a new page using “ionic g page …” and I noticed that typescript class was generated with a @Component selector declaration per default.

    selector: 'page-todo',
    templateUrl: 'todo.html'

Usually, when I wrote pages which I know I’m not gonna include in other components (let’s say root pages or full pages), I didn’t add the selector attribute. Most of my pages look like

    templateUrl: 'todo.html'

Is that a bad practice? Is it better to always specify selector?

Seems like Ionic uses the selector for styling. In your example you would have a todo.scss file with

page-todo {
  // add your styles here

If you do have a selector your component will be rendered as e.g.

  <!-- rendered template here -->

so that page-todo element can be used for applying css rules. If you don’t specify a selector Angular will generate something like

  <!-- rendered template here -->

So yeah it’s better to always specify a selector.

1 Like

Thx for the answer, make sense. In that way I don’t have to set an id on each pages for my specific styles.

Is there any way to use @Input here? I’m having problems doing that.

I’m not following you. What does @Input have to do with selector?

If you have a parent component with an object, and you use a selector to display a child component, you can pass the object to the child component this way in Angular 2:

In the parent.html
<child-component [nameOfObjectInsideChildComponent] = "nameOfObjectInsideParentComponent"></child-component>

Then in child.ts
@Input nameOfObjectInsideChildComponent: any;

But in Ionic 2, I’m having problems getting the object in the child component. I get no errors but my object is undefined. Maybe in Ionic this is done in a different way?

Thanks for your time!

Why don’t you post a separate question?

Exactly what I was going to do if you didn’t know the answer.