Angular 5 @Input 宽度并应用于 div答案

【问题标题】：Angular 5 @Input width and apply to divAngular 5 @Input 宽度并应用于 div
【发布时间】：2018-02-05 19:15:33
【问题描述】：

这必须很容易。尝试输入像 50%, 50px, 20rem ... 这样的字符串作为宽度，然后将其应用于组件的 html。

<test title="frump" width="50%"></test>

export class test {
  @Input() title: string;
  @Input() width: string;
       ...
  getWidth() {
    return this.width;
  }

<div [ngStyle]="{'width.px': 'getWidth()', ... or
<div [ngStyle]="{'width': 'width', ...

宽度被完全忽略...？提前致谢。

【问题讨论】：

<div [ngStyle]="{'width': width, ... 或 <div [style.width]="width".

标签： html angular input

【解决方案1】：

看起来您的问题是围绕“宽度”（第二个）的引号。它是一个变量，所以不应该用引号引起来。我的例子：

https://stackblitz.com/edit/angular-tgqahd?file=app%2Fapp.component.html

【讨论】：