Question

当我选择将此样式设置为select（parent）元素时，我正试图获取选项的样式。

我无法获得所选的选项的样式。只有它的价值可用......

有没有办法在Angular中获得它？请在下面找到代码，需要一些帮助。

<div ng-controller="MyController">

 <select ng-model="element" ng-change="getElement(element)" ng-style="getSelectedStyle(color)">
     <option ng-repeat=option in options" ng-style="{'color' : option.color}">  //NG-STYLE
          {{option.value}}
     </option>
 </select>

</div>

(function(){

  app.controller('MyController', function($scope){

    $scope.element;
    $scope.getElement = function(item){
       console.log(item);
    };

    $scope.color = 'red';
    $scope.getSelectedStyle = function(){
       return { 'color' : $scope.color };
    };


    $scope.options = [

       {
          value : 'ezez',
          color : 'blue'
       }
    ];

  });  

})();

Answer 1

你必须以ng风格传递一个对象，所以尝试像

这样的东西

ng-style="{'color': option.color}"

在您的模板中，您使用getSelectedStyle(color)，但在您的控制器中有

$scope.getSelectedStyle = function(){
   return { 'color' : $scope.color };
};

我认为你的$scope.color在getSelectedStyle（）中你应该使用$scope.element并在你的函数中执行此操作。

$scope.getSelectedStyle = function(){
   return { 'color' : $scope.element.color };
};

Answer 2

您的加价将是

<select ng-model="element" ng-change="getElement(element)" ng-style="getSelectStyle(color)">
     <option ng-repeat="option in options" ng-style="{'color': option.color == element.color ? 'option.color': 'defaultColor' }">
          {{option.value}}
     </option>
 </select>

Angularjs：获取所选选项的样式

2 个答案: