我正在尝试对angular6中left
的{{1}}属性进行动画处理。
最终值是未知的,直到我根据一些HTML元素对其进行了计算。该计算将始终在触发动画之前进行。结果将存储在div
中。
因此,我需要能够将myVariableWidth
中定义的200px
值更改为myVariableWidth
。
示例代码
NewsfeedComponent
PS:我知道我可以使用CSS的@Component({
selector: 'app-newsfeed',
templateUrl: './newsfeed.component.html',
styleUrls: ['./newsfeed.component.css'],
animations: [
trigger('showNewsitem', [
state('right', style({
// this value will be calculated based on myVariableWidth in the
component
left: '200px'
})),
state('left', style({
left: '0px',
})),
transition('right => left', [
animate('2s')
]),
transition('left => right', [
animate('0.5s')
])
]), // end trigger
],
})
export class NewsfeedComponent implements OnInit {
public myVariableWidth: number;
}
或JavaScript的transition
而不是angular的动画来实现这一点。但我想知道是否存在“角度方法”。