我正在尝试创建一个具有属性作为选择器的组件,如下所示:
@Component({
selector: '[my-attribute-selector]',
template: ``
})
export class MyComponent {
// Some cool stuff
}
Run Code Online (Sandbox Code Playgroud)
然而,tslint抱怨这一点,并带有以下消息:
[tslint] The selector of the component "MyComponent" should be used as element
Run Code Online (Sandbox Code Playgroud)
我知道我可以禁用该tslint规则,但我想知道在这样做之前是否有合理的原因我不应该使用属性作为组件的选择器.
提前致谢!
我已经使用 Bootstrap 4 创建了一个基本的基于网格的布局。
我有两列:左和右。左列是 a div.col-12.col-md-5,右列是div.col-12.col-md-7。事情是,左列里面有一个表格,因为表格不是可以调整大小的,所以我希望左列的最小宽度为 460px(所以表格中的数据总是可以正确看到)。但我确实希望右侧的另一列能够完全响应并不断调整大小(直到屏幕大小 < md 断点 -768px-)。
我的布局看起来像这样:
为了尝试实现这种行为,我创建了这段 css:
@media (min-width: 768px) {
.min-width-460-md {
min-width: 460px;
}
}
Run Code Online (Sandbox Code Playgroud)
我已经将 .min-width-460-md 类应用于左列。所以我的 html 代码看起来像下一个:
<section class="container-fluid">
<div class="row">
<div class="col-12 col-md-5 min-width-460-md">
First column (left) which contains a table and needs to be min-width 460px.
</div>
<div class="col-12 col-md-7">
Second column (it contains more resizable data, so no min-width required here).
</div>
</div>
</section>
Run Code Online (Sandbox Code Playgroud)
问题是,将这个新类应用于左列,当它达到 460px 时,它会停止调整大小(如我所愿),但右列位于左列下方,如下所示:
我显然不希望这种情况发生。我真正想要的是,当左列达到 460px 时,它会停止调整大小,但右列会继续调整大小,直到屏幕小于 768px …