Question

我有changes变量，它在component.ts文件中为布尔值。 .html文件中也使用此变量。我正在尝试在.scss文件中访问此变量，并且根据布尔条件（如果为true），应将移动属性应用于网站。如何在scss文件中访问此布尔变量并将其应用于＆.Mobile，并确保更改可编辑模板正常运行？

这是我的.html文件

    <div class="ab-table-filters">

这是我的scss文件

.bot {
  border-radius: 2px;
  text-align: left;
  width: 100%;

  @media (min-width: 700px) {
    display: none;
  }
}
      .open {
        ul {
          position: relative;
          top: auto;
        }
      }
    }
  }
  .ab-table-filter {
    border-radius: 2px;


    @media (max-width: 700px) {
      display: none;
    }

    &.disabled {
      opacity: .4;
      pointer-events: none;

      &:hover {
        cursor: no-drop;
      }

}

}

Answer 1

IMO，你不能。

相反，您可以根据HTML元素中变量的值将CSS / SCSS类绑定到模板中，例如-

<div [ngClass]="{'ab-table-filters':true, 'css-class': changes }">

在这里，我同时添加了组合，默认情况下始终应用的类和动态CSS类，希望对您有所帮助。

更新-

@media screen and (max-width: 768px) {
  body {
    background-color: red;
  }
}

如何从HTML或ts文件将布尔变量访问到scss中？

1 个答案: