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?
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.
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.
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).
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.
+1 for using this in JS code (to be used for example in classNameBindings)
+1
+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.
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
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.
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?
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
Most helpful comment
I also expected to be able to reference
hasBlockin my component js code. IMO it should be accessible if only because it intuitively seems like it should be.