Angular 1.x 使用用户输入动态改变元素的宽度

Question

我正在动态创建一个元素，我需要控制它的宽度和位置。我正在尝试通过以下方式在创建的元素中使用 input 和 ng-model 和 ng-style 指令来更改其样式：
JS:

function createElementAndAppend(){
    element = angular.element("<"+element+" id='inputTag' ng-click='selectClickedElm($event.currentTarget)' ng-style='{width: w + 'px'} placeholder='input'>");
    angular.element(document.getElementById('board')).append($compile(element)($scope));
}

HTML:

<input type="number" ng-model="w" placeholder="change width">

我遇到一个错误：

Error: [$parse:ueoe] Unexpected end of expression: {width: w

显然问题出在 ng-style='{width: w + 'px'}。我如何将加号写入 angular 将知道将 w 的值解释为 px 作为元素的最终宽度？

Answer 1

我还没有测试过，但这应该有效：

element = angular.element("<"+element+" id='inputTag' ng-click='selectClickedElm($event.currentTarget)' ng-style='{width: w + \"px\"}' placeholder='input'>");

Angular 1.x 使用用户输入动态改变元素的宽度

Angular 1.x dynamically change element's width using user input

javascript

angularjs

ng-style