Angular 2 : Wrapping a component inside a parent component

标签 angular angular-components

我正在尝试将一个组件放入父组件中,就像在 React 中那样。

react 示例:

父组件:

<div>
  Hello from parent
  {this.props.children}
</div>

子组件:

<ParentComponent>
  Hello from child
</ParentComponent>

基本上我要做的是在父标签之间包含子标签。

传递一个元素的@Input 浮现在我的脑海中,但这听起来非常错误和丑陋。

最佳答案

父组件:

<div>
  Hello from parent
  <ng-content select=".txt"></ng-content>
</div>

子组件:

<ParentComponent>
  <ng-container class="txt">
        Hello from child
    </ng-container>
</ParentComponent>

输出: 来自家长的问候 来自 child 的问候

关于 Angular 2 : Wrapping a component inside a parent component,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48593170/

相关文章:

javascript - 如何监听 Angular 1.5 组件中的作用域事件?

angular-components - 具有名称绑定(bind)的 Angular UpgradeComponent

angular - 使用 msal.js 对 Angular SPA 进行身份验证

angular - typescript :使用类作为接口(interface)

angularjs - 学完Angular 2+,学AngularJS到底有多难?

Angular 2 : Input setter not picking up set event if value does not change

javascript - Angular 表单提交事件在父组件和子组件之间触发两次

angular - 何时使用 Angular 指令、组件和模块

Angular 2 Reactive form Validator - 如何允许null,但是当有输入时,输入需要是数字?

node.js - Windows 10 中的 npm 安装错误 ( npm install -g angular-cli )