New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hasBlock not available in component init #11741

Closed
tp opened this Issue Jul 14, 2015 · 11 comments

Comments

Projects
None yet
@tp

tp commented Jul 14, 2015

When initialising a component I want to checker whether it was called with a block or not. (If it's not called with a block a parameter should be set on the component).

While this works fine in the template, the following code does not behave as expected in the component:

export default Ember.Component.extend({
  init: function() {
    this._super();

    if (!this.get('hasBlock')) { console.log('always ends up here, even with a block set'); }
  },
});

Should this be possible or would you consider that a bad practice?

@rwjblue

This comment has been minimized.

Show comment
Hide comment
@rwjblue

rwjblue Jul 14, 2015

Member

hasBlock is only available in template contexts (its implemented as a template layer keyword), and is not intended to be available in the components JS code.


In general, I would suggest not trying to do different things in your components JS code based on if a block was supplied. It is much better to do this sort of thing from the template instead.

Member

rwjblue commented Jul 14, 2015

hasBlock is only available in template contexts (its implemented as a template layer keyword), and is not intended to be available in the components JS code.


In general, I would suggest not trying to do different things in your components JS code based on if a block was supplied. It is much better to do this sort of thing from the template instead.

@tp

This comment has been minimized.

Show comment
Hide comment
@tp

tp Jul 15, 2015

Doing it in the component would work as well, of course.

The only issue I had with doing that is that it fails silently at runtime.

tp commented Jul 15, 2015

Doing it in the component would work as well, of course.

The only issue I had with doing that is that it fails silently at runtime.

@mmun mmun closed this Jul 24, 2015

@vanthome

This comment has been minimized.

Show comment
Hide comment
@vanthome

vanthome Aug 28, 2015

Contributor

I think it can make sense to expose it in the component as well. I need to set a class depending on the presence of a block or not on the root element. I don't think this is possible with components now (with tagless components it will of course).

Contributor

vanthome commented Aug 28, 2015

I think it can make sense to expose it in the component as well. I need to set a class depending on the presence of a block or not on the root element. I don't think this is possible with components now (with tagless components it will of course).

@lmcardle

This comment has been minimized.

Show comment
Hide comment
@lmcardle

lmcardle Oct 22, 2015

Just came across this issue...I have the same need. In my case, the CSS class applied will change depending if there is a block.

lmcardle commented Oct 22, 2015

Just came across this issue...I have the same need. In my case, the CSS class applied will change depending if there is a block.

@jcbvm

This comment has been minimized.

Show comment
Hide comment
@jcbvm

jcbvm Nov 17, 2015

+1 for using this in JS code (to be used for example in classNameBindings)

jcbvm commented Nov 17, 2015

+1 for using this in JS code (to be used for example in classNameBindings)

@Exelord

This comment has been minimized.

Show comment
Hide comment
@Exelord

Exelord Apr 12, 2016

Contributor

+1

Contributor

Exelord commented Apr 12, 2016

+1

@JennieJi

This comment has been minimized.

Show comment
Hide comment
@JennieJi

JennieJi Jun 10, 2016

+1 what I want is just add a class name binding related to hasBlock property since your document mentioned about this property http://emberjs.com/api/classes/Ember.Component.html#property_hasBlock, and you didn't say it can only be used in template at all.

JennieJi commented Jun 10, 2016

+1 what I want is just add a class name binding related to hasBlock property since your document mentioned about this property http://emberjs.com/api/classes/Ember.Component.html#property_hasBlock, and you didn't say it can only be used in template at all.

@atomkirk

This comment has been minimized.

Show comment
Hide comment
@atomkirk

atomkirk Feb 6, 2017

In general, I would suggest not trying to do different things in your components JS code based on if a block was supplied

This is fine unless you have complex logic to decide if you want to show the block, then your template becomes very messy and you need to write lots of logic helpers just because you can't move the logic to your js file

atomkirk commented Feb 6, 2017

In general, I would suggest not trying to do different things in your components JS code based on if a block was supplied

This is fine unless you have complex logic to decide if you want to show the block, then your template becomes very messy and you need to write lots of logic helpers just because you can't move the logic to your js file

@sdhull

This comment has been minimized.

Show comment
Hide comment
@sdhull

sdhull Oct 21, 2017

Contributor

I also expected to be able to reference hasBlock in my component js code. IMO it should be accessible if only because it intuitively seems like it should be.

Contributor

sdhull commented Oct 21, 2017

I also expected to be able to reference hasBlock in my component js code. IMO it should be accessible if only because it intuitively seems like it should be.

@xcambar

This comment has been minimized.

Show comment
Hide comment
@xcambar

xcambar Aug 2, 2018

Contributor

I'll also 👍 this request.

We want to mimic the behaviour of the {{link-to}} where the number of positional parameters depends on the presence (resp. absence) of a block.

This has been done in the Ember code base in the LinkComponent by using HAS_BLOCK in the JS file.

If the core team is not willing to open up to this request, can I get help about how to implement similar behaviour as the one of {{link-to}} regarding the management of its params?

Contributor

xcambar commented Aug 2, 2018

I'll also 👍 this request.

We want to mimic the behaviour of the {{link-to}} where the number of positional parameters depends on the presence (resp. absence) of a block.

This has been done in the Ember code base in the LinkComponent by using HAS_BLOCK in the JS file.

If the core team is not willing to open up to this request, can I get help about how to implement similar behaviour as the one of {{link-to}} regarding the management of its params?

@jmonster

This comment has been minimized.

Show comment
Hide comment
@jmonster

jmonster Aug 2, 2018

another scenario where this is very nice to have..

  messageBannerText: computed(function() {
    if (!this.get('hasBlock')) {
      throw new Error("messageBannerText must be passed into {{generic-banner ...}}");
    }
  }),

I'd like to keep this convenient way to aid a developer in using my component, but i don't want it to erroneously force a value when a block has been provided instead

jmonster commented Aug 2, 2018

another scenario where this is very nice to have..

  messageBannerText: computed(function() {
    if (!this.get('hasBlock')) {
      throw new Error("messageBannerText must be passed into {{generic-banner ...}}");
    }
  }),

I'd like to keep this convenient way to aid a developer in using my component, but i don't want it to erroneously force a value when a block has been provided instead

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment