如何使用 n 样式设置 div 宽度

我试图使用 ng-style动态设置 div 宽度，但它没有应用样式。密码如下:

<div style="width: 100%;" id="container_fform" ng-controller="custController">
<div style="width: 250px;overflow: scroll;">
<div ng-style="myStyle">&nbsp;</div>
</div>
</div>

总监:

var MyApp = angular.module('MyApp', []);


var custController = MyApp.controller('custController', function ($scope) {
$scope.myStyle="width:'900px';background:red";


});

我错过了什么？

小提琴链接: 小提琴

132895 次浏览

小开

ngStyle接受一张地图:

$scope.myStyle = {
"width" : "900px",
"background" : "red"
};

Fiddle

小开

ng-style的语法并非如此。它接受键(属性名称)和值(它们应该接受的值，一个空字符串未落 them)的字典，而不仅仅是字符串。我觉得你想要的是:

<div ng-style="{ 'width' : width, 'background' : bgColor }"></div>

然后在你的控制器里:

$scope.width = '900px';
$scope.bgColor = 'red';

这保留了模板和控制器的分离: 控制器保留语义值，而模板将它们映射到正确的属性名称。