首页 文章

如何有条件地设置Angular2组件输入?

提问于
浏览
1

考虑以下情况 .

父组件:

<div title="title1">
  <my-component input="title2"></my-component>
  <my-component></my-component>
</div>

MyComponent的:

<div [title]="input">ABC</div>

这里的问题是,第一个"ABC" div将具有 "title2" 工具提示,而第二个将具有MyComponent具有的 input 的默认值,这将是"override" "title1" tooltip,这是不希望的 .

如果没有收到“输入”,如何避免在MyComponent模板中设置“title”?

1 回答

  • 0

    看起来绑定子元素的 title 属性将覆盖父 title ,即使 inputnullundefined . 但是,根据this stackblitz,将title属性与 [attr.title] 绑定允许在 inputnullundefined 时继承父 title

    <div [attr.title]="input">ABC</div>
    

    @Input() input: string; // undefined by default
    

相关问题