How to pass controller observed property in component

Question

I am working on an application where I am passing a property that is being observed in controller, to the component but I am getting undefined value. I am using ember 1.6

How I call component:-

{{range-slider min="0" max="100" step="1" value=currentVal}}

Component implementation is:-

App.RangeSliderComponent = Ember.Component.extend({
tagName:'',
currentValue:function(){
    return this.get('value');
}.property('value'),

minValue:function(){
    return this.get('min');
}.property('min'),

didInsertElement:function(){
    console.log("component with currentValue="+this.get("currentValue")+" minValue="+this.get('minValue'));

}

})

currentVal used as component value is a property being observed in controller. Whenever I slide the slider, the currentVal is changed as it is bound with the component. The default value is 50. Controller is working fine.

The controller part is:-

currentVal:50,

currentValChanged:function(){
    console.log("currentVal changed");
}.observes('currentVal'),

In component, I am getting the min value correctly but not getting the value. It's coming undefined.

How to get the property value in component?

Update

I am able to get variable by following methods in component:-
1) If I pass a variable directly to component with static value, it works. e.g the max value passed in range-slider component.
2) If I pass a static variable that is defined in controller e.g. in controller

dummyValue:2345,

If I pass dummy value to component, I can read it in component part.

But if the property is computed property then it's not working.

Answer 1

I doubt your controller is setting undefined value to currentVal property in controller part. Please have a look at the twiddle which is working..