在另一个组件中以不同方式设置子组件的样式

时间:2017-03-28 11:18:17

标签: angular typescript sass

我正在尝试设置我的alert框(来自bootstrap)[也是一个组件],当它显示在我的一个组件中时略有不同。对于其他地方,我想使用其默认样式。

我能够通过使用来实现我想要的目标:

我的父组件中的

encapsulation: ViewEncapsulation.None。但是我真的想避免它,并学习使用最佳实践。

任何人都可以解释如何在不修改encapsulations的情况下实现这一目标吗?

在某些帖子中,用户提到使用:host::content css属性,但到目前为止我无法使用它们。

我认为这是一种非常常见的情况,应该有一个很好的方法。

1 个答案:

答案 0 :(得分:1)

您可以在父母中使用 create_table "landslides", force: :cascade do |t| t.integer "total_id" t.integer "year_id" t.date "start_date" t.date "end_date" t.integer "day_number" t.string "continent" t.string "country" t.string "location" t.string "type" t.integer "admin_level" t.float "lat" t.float "lng" t.boolean "mapped" t.float "spatial_area" t.integer "fatalities" t.integer "injuries" t.string "notes" t.datetime "created_at", null: false t.datetime "updated_at", null: false t.string "trigger" end ,例如

/deep/

使选择器跨越组件边界而不将:host /deep/ some-grand-child { color: blue; } 设置为ViewEncapsulation