Question

我想在我的ng风格中组合两种风格，其中一种是条件风格。

ng-style="{'height':height + '%'}"

ng-style="hasScroll !== 0 && {'width': (tableWidth) + 'px'}"

如果条件为假，如何在不覆盖宽度的情况下组合它们？

以下情况不好，因为如果条件为falsefalse，它会覆盖'width'属性：

ng-style="{ 'height': height + '%', 'width': hasScroll !== 0 ? (tableWidth) + 'px' : undefined }"

Answer 1

然后，它更好地处理你在控制器中的逻辑

<div ng-style="getStyles()">
test data
</div>

$scope.getStyles = function () {
   var styleObj = {};
   styleObj['height'] = height + '%';
   if ($scope.hasScroll !== 0) {
     styleObj['width'] = tableWidth + 'px';
   }
   return styleObj;
}

Answer 2

试试这个：

<xmlConfig Id="myConfigElement> File="{INSTALLFOLDER]\config...myConfigFile.xml" Action ="create" On="install" Node="value"
Name="name" Value="[propertyContainingUsersInput]"
ElementPath="//pathToNode...[\[]@Name = 'oldName'[\]]" Sequence = "1"/>

工作示例：

ng-style="hasScroll !== 0 && {'width': (tableWidth) + 'px'} || { 'height': height + '%'}"

var myApp = angular.module('myApp', []);

function MyCtrl($scope) {
     $scope.has = 1;
    
}

Answer 3

你可以尝试但不容易阅读：

ng-style="{ 'height':height + '%', 'width': hasScroll !== 0 ? (tableWidth) + 'px' : undefined }"

Answer 4

我想你可以这样做：

ng-style="{ width: hasScroll !== 0 ? tableWidth : 0, height: height }"

Answer 5

您可以通过,分隔

添加多个属性

<div ng-style="{ 'height': height + '%', 'width': hasScroll !== 0 ? (tableWidth) + 'px' : undefined }">
test data
</div>

结合多种和连续的ng风格

5 个答案: