如何访问在组件类中传递给Ember Component的属性?

San*_*ram 4 components properties ember.js

我在模板中声明了一个emberjs组件:

<script type="text/x-handlebars" id="components/custom-component">      
  <h4>The name of the object passed is : {{object.name}}</h4>
  {{#if show_details}}
    <p>The details of the object passed are : {{object.details}}</p>
  {{/if}}
</script>
Run Code Online (Sandbox Code Playgroud)

现在我在我的html模板中使用这个组件:

<script type="text/x-handlebars" data-template-name="index">
  <ul>
    {{#each object in model}}
      <li>{{custom-component object=object}}</li>
    {{/each}}
  </ul>
</script>
Run Code Online (Sandbox Code Playgroud)

我的自定义组件的组件类如下所示:

App.CustomComponentComponent = Ember.Component.extend({
  show_details: function() {
      // return true or false based on the OBJECT's property (e.g. "true" if object.type is 'AUTHORIZED')
  },
});
Run Code Online (Sandbox Code Playgroud)

更新

我实现它的方式如下:

App.CustomComponentComponent = Ember.Component.extend({
    show_details: function() {
      var object = this.get('object');
      if (object.type == "AUTHORIZED")
        return true;
      else
        return false;
    }
});
Run Code Online (Sandbox Code Playgroud)

传递给组件类的参数可以使用它的get方法.

spl*_*tne 6

它应该这样工作:

{{custom-component object_name=object}}
Run Code Online (Sandbox Code Playgroud)

(你刚才使用了错误的属性名称).

如果object是对象名称,这应该有效.如果name是object当时使用的属性object.name.


UPDATE

这应该是直截了当的.show_details应根据以下内容定义为计算属性object type:

App.CustomComponentComponent = Ember.Component.extend({
    object: null,
    show_details: function() {
      var object = this.get('object');
      if (object.get('type') === "AUTHORIZED")
         return true;
      else
         return false;
    }.property('object.type') 
});
Run Code Online (Sandbox Code Playgroud)

或者更简单:

App.CustomComponentComponent = Ember.Component.extend({
    show_details: function() {
      return this.get('object').get('type') === "AUTHORIZED";
    }.property('object.type') 
});
Run Code Online (Sandbox Code Playgroud)

get访问Ember对象的属性时不要忘记使用.