本文整理汇总了TypeScript中@angular/core.Renderer.setElementStyle方法的典型用法代码示例。如果您正苦于以下问题：TypeScript Renderer.setElementStyle方法的具体用法？TypeScript Renderer.setElementStyle怎么用？TypeScript Renderer.setElementStyle使用的例子？那么恭喜您, 这里精选的方法代码示例或许可以为您提供帮助。您也可以进一步了解该方法所在类@angular/core.Renderer的用法示例。
在下文中一共展示了Renderer.setElementStyle方法的10个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: ngOnChanges
ngOnChanges(changes: any) {
if (_.isEmpty(_.intersectionBy(this.permission, this.permissionAction.split(',')))) {
this.renderer.setElementStyle(this.element.nativeElement, "display", "none");
} else {
this.renderer.setElementStyle(this.element.nativeElement, "display", "");
}
}示例2: alignToElement
/**
* Calculates the styles from the provided element in order to align the ink-bar to that element.
* Shows the ink bar if previously set as hidden.
* @param element
*/
alignToElement(element: HTMLElement) {
this.show();
this._renderer.setElementStyle(this._elementRef.nativeElement, 'left',
this._getLeftPosition(element));
this._renderer.setElementStyle(this._elementRef.nativeElement, 'width',
this._getElementWidth(element));
}示例3: _setPosition
private _setPosition(x: number, y: number): void {
switch (this._cascadeMode) {
case 'up':
case 'left':
default:
this._renderer.setElementStyle(
this._ngEl.nativeElement,
'transform',
'translate(' + x + 'px, ' + y + 'px)'
);
break;
case 'right':
this._renderer.setElementStyle(
this._ngEl.nativeElement,
'transform',
'translate(' + -x + 'px, ' + y + 'px)'
);
break;
case 'down':
this._renderer.setElementStyle(
this._ngEl.nativeElement,
'transform',
'translate(' + x + 'px, ' + -y + 'px)'
);
break;
}
}示例4: positionContent
positionContent(nativeElm :any, hostDim : any, elmDim : any): void {
const { top, left } = PositionHelper.positionContent(
this.placement, elmDim, hostDim, this.spacing, this.alignment);
this.renderer.setElementStyle(nativeElm, 'top', `${top}px`);
this.renderer.setElementStyle(nativeElm, 'left', `${left}px`);
}示例5: hover
hover(underline: boolean){
if(underline){
this.renderer.setElementStyle(this.el.nativeElement, 'text-decoration', 'underline');
} else {
this.renderer.setElementStyle(this.el.nativeElement, 'text-decoration', 'none');
}
}示例6: toggle
toggle(collapsed: boolean) {
if(!collapsed){
this.renderer.setElementStyle(this.bodyEl.nativeElement, 'height', 'auto');
}else{
this.renderer.setElementStyle(this.bodyEl.nativeElement, 'height', '0');
}
}示例7: updateSliderUI
private updateSliderUI() {
var fraction = (this.value_ - this.min) / (this.max - this.min);
this.renderer.setElementClass(this.inputEl.nativeElement, 'is-lowest-value', fraction === 0);
this.renderer.setElementStyle(this.lowerEl.nativeElement, 'flex', '' + fraction);
this.renderer.setElementStyle(this.upperEl.nativeElement, 'flex', '' + (1 - fraction));
}示例8: onFocus
onFocus(){
this.renderer.setElementStyle(this.el.nativeElement,'width','250');
this.renderer.setElementStyle(this.el.nativeElement,'width','250');
this.renderer.setElementStyle(this.el.nativeElement,'width','250');
this.renderer.setElementStyle(this.el.nativeElement,'width','250');
this.renderer.setElementStyle(this.el.nativeElement,'width','250');
}示例9: onClick
@HostListener('click') onClick() {
let isToggled = this._el.nativeElement.parentElement.classList.contains('toggled');
this._renderer.setElementClass(this._el.nativeElement.parentElement, 'toggled', !isToggled);
if (isToggled) {
this._renderer.setElementStyle(this._el.nativeElement.nextElementSibling, 'display', 'none');
} else {
this._renderer.setElementStyle(this._el.nativeElement.nextElementSibling, 'display', 'block');
}
}示例10: positionCaret
positionCaret(hostDim: any, elmDim: any): void {
const caretElm = this.caretElm.nativeElement;
const caretDimensions = caretElm.getBoundingClientRect();
const { top, left } = PositionHelper.positionCaret(
this.placement, elmDim, hostDim, caretDimensions, this.alignment);
this.renderer.setElementStyle(caretElm, 'top', `${top}px`);
this.renderer.setElementStyle(caretElm, 'left', `${left}px`);
}