相关疑难解决方法(0)

为什么以下工作？

<something>.stop().animate(
    { 'top' : 10 }, 10
);

虽然这不起作用:

var thetop = 'top';
<something>.stop().animate(
    { thetop : 10 }, 10
);

为了使它更清晰:目前我无法将CSS属性作为变量传递给animate函数.

我正在开发一个角度为2的测试应用程序,我遇到了一个基于模型列表添加类的问题.

在Angular 1中,可以做到:

// model
$scope.myClasses = ['class1', 'class2', ...];

// view
... ng-class="myClasses" ...

在Angular 2中,我迄今为止所做的就是:

// view
... [class.class1]="true" [class.class2]="true" ...

这显然不是很有活力,我相信必须有更好的方法来做到这一点.

但是,我也尝试过:

// model
class ... {
    private myClasses: any;
    constructor() {
        this.myClasses = ['class1', 'class2', ...];
    }

// view
... [class]="myClasses" ...

但这不起作用,我尝试过myClasses单个类的字符串名称,字符串数组,带有类名键的对象和值作为值的true,这类对象的数组,但遗憾的是,列出的任何内容都不起作用这条路.

HTML:

<div *ngFor="let record of lift" class="list-lifts" [class.showLifts]="isBtnActive">

零件:

isBtnActive: boolean = false;

toggleClass() {
    this.isBtnActive = !this.isBtnActive;
  }

CSS:

.list-lifts {

  &:not(:first-of-type) {
    margin-top: -11px !important;
    display: none;
  }
}

.showLifts {
  display: block !important;
}

// I need something like this to be built in the view:
.ValueshowLifts {}

该toggleClass()功能.showLifts在单击按钮时切换CSS类.这非常有效.

问题是,我需要类.showLifts具有动态名称,我不确定生成它的语法是什么.出于逻辑原因,这是一个例子:

[class.{{ record.name }}showLifts]="isBtnActive"

但当然这不是有效的语法.

我开发了一个Angular 2应用程序,我试图在其中应用CSS类ngClass.我已将类名存储在变量中className并尝试使用以下代码来应用:

1. 第一种方式

   [ngClass]={'{{className}}': expression}
   

   Run Code Online (Sandbox Code Playgroud)

2. 第二种方式

   [ngClass]= {className: expression}
   

   Run Code Online (Sandbox Code Playgroud)

但他们都没有奏效.

我想基于我的组件打字稿文件中的对象中的项添加一个类.我似乎无法使格式正确的工作.

当'selectedColourPalette'值大于零时,我想将'colourPaletteOne'中的主要颜色添加到HTML中.

CSS

colourPaletteOne = {
    primary: 'blue', 
    secondary: 'grey',    
  }

HTML

<div> [ngClass]="{'border-{{colourPaletteOne.primary}}' : selectedColourPalette > 0}"></div>