How do I access component properties in a transcluded view in ember?

I am passing some html to a components in ember. The html is yielded. But the yielded html is unable to access properties defined in the component. However the properties do work on the component template.

component

import Ember from 'ember';

export default Ember.Component.extend({
  user: undefined,
  replyText: undefined,

  onInitialization: function(){
    this.set('replyText', '@' + this.user.get('username') + ' ');
  }.on("init"),

  remainingTweetChars: function () {
    var length = 140 - this.get('replyText').length;

    return length;
  }.property('replyText')

});

component template

{{remainingTweetChars}} {{!-- this works --}}

{{yield}}

component usage with html which is yielded into the component template above

{{#action-reply class="item-actionables__reply"
  user=user
}}

  <span>{{remainingTweetChars}}</span> {{!-- this does NOT works --}}
  <span>{{view.remainingTweetChars}}</span> {{!-- this does NOT works --}}
{{/action-reply}}