我在打字稿中构建了一个IONIC 2项目。我有以下的CSS：Typescript打击scss风格属性的麻烦

.bottle { 
    background: linear-gradient(0deg, pink 100%, white 0%); 
}

，我想调整的线性梯度从pink值，从Javascript/Typescript.I已经做了我的打字稿以下，但我得到了一个错误说， styleFile元素不存在于BottleFill上。我做错了什么？

import {Page, Alert, NavController} from 'ionic-angular'; 

@Page({ 
    templateUrl: 'build/pages/hello-ionic/hello-ionic.html' 
}) 

export class HelloIonicPage { 
    constructor(public nav: NavController) { } 

    updateDisplay(batteryPercentage){ 
     var bottleFill = document.getElementsByClassName('bottle')[0]; 

     if(percentage <= 100){ 
      bottleFill.style.linerar-gradient.pink = batteryPercentage + '%'; 
      batteryPercentage += 5; 
     }   
    } 
}

更新：

完整的错误：使用ngOnInit使用元素选择没有工作

The property 'style' does not exist on type 'Element'

...

来源

2016-03-15 George Edwards

是bottleFill不确定？该代码可能在元素呈现之前运行。 –

也许你应该检索在的CSS ngAfterViewInit方法，一旦视图初始化，由Angular调用： http://learnangular2.com/lifecycle/

来源

2016-03-16 08:01:45

恐怕没有帮助，我只是得到“bottleFill无法识别”，我会用更多的细节更新问题 –

您可以使用类型断言通知打字稿，它实际上是HTML元素：

var bottleFill = document.getElementsByClassName('bottle')[0] as HTMLElement;

来源

2017-04-10 23:17:29

Typescript打击scss风格属性的麻烦

更新：

回答

相关问题