如何将 ng-content 的角码渲染到组件端？答案

【问题标题】：How to render angular code of ng-content to component side?如何将 ng-content 的角码渲染到组件端？
【发布时间】：2016-03-26 06:03:07
【问题描述】：

我该如何使用如下：这里<test>的内容中的{{x-value}}指的是test.html的JS类。如何让它引用组件类。

test.html

<test x-value="abc">
<b>{{x-value}}</b>
</test>

test-com.js

@Component({
    selector : 'test',
  template : '<ng-content></ng-content>',
  directives : [IONIC_DIRECTIVES],
  providers : [],
  inputs : ['value : x-value'],
});
export class Test{
   constructor() {

   }
   ...

}

【问题讨论】：

这种方法有什么问题？
{{x-value}} // 这里x-value不打印abc（我想在这里打印abc 测试>
但x-value 指的是testcmp 的输入属性。所以它将在testcmp模板中可用。
是的。那是问题。当我将 ng-content 放在组件的模板中时，ng-content 的内容必须引用 testcmp 输入属性。有没有其他方法可以做到这一点？请给点提示！！！谢谢

标签： javascript angular ionic2

【解决方案1】：

事实上，您的表达式是针对当前组件执行的。我的意思是您使用测试的组件。

如果你想从测试组件中获取价值，你可以试试这个：

<test #test x-value="abc">
  <b>{{test['x-value']}}</b>
</test>

使用局部变量（用# 定义），您可以获得测试组件本身的引用。然后，您可以使用它在测试组件的输入内容中使用插值来显示其“x-value”属性。

【讨论】：