Question

当我点击该div时，我想获得DIV元素的背景颜色。

HTML -

$scope.getFilter = function(event){

};

JS控制器 -

$('div').click(function(){
   $color = $(this).css('background-color');
});

如果我们在jQuery中进行，那么它将以 -

完成

con.Open();                
            MySqlCommand command1 = con.CreateCommand();
            MySqlDataReader Reader;
            command1.CommandText = "SELECT service,price FROM `order` WHERE billno='" + label15.Text + "' AND dates=DATE(NOW())";
            Reader = command1.ExecuteReader();
            while (Reader.Read())
            {
                string thisrow = "";                    
                for (int k = 0; k < Reader.FieldCount; k++)                        
                    thisrow += Reader.GetValue(k).ToString() +"".PadRight(10);
                    listBox1.Items.Add(thisrow);                    
            }
            con.Close();

但是我想用angularJs做。有人帮忙吗？

Answer 1

你可以使用：

$scope.getFilter = function(event) {
    $scope.color = $(event.currentTarget).css('background-color');
};

Answer 2

您可以使用ng-style动态设置颜色，我只是将其放在每个记录的API响应中。我假设你使用ng-repeat指令渲染所有元素。

<强>标记

<div ng-repeat="item in items" 
   ng-style="{'background-color': item.color}"
   ng-click="getFilter(item);" 
   class="agenda col-md-4">
      ABCDEGF
</div>

<强>代码

$scope.getFilter = function(item){
    $color = item.color;
}

Answer 3

使用service创建示例示例以动态获取和指定颜色。 JSFiddle - https://jsfiddle.net/q16fcq99/ 使用所需的呼叫修改服务。希望这会有所帮助。

    <body ng-app="SampleApp">
      <div ng-controller="fcController">
        <div ng-style="{'background-color': divColor}" ng-click="getFilter($event);" class="agenda col-md-4">
          ABCDEGF
        </div>
      </div>
    </body>

        var sampleApp = angular.module("SampleApp", []);
    sampleApp.controller('fcController', function($scope, colorService) {
      $scope.divColor = 'red';
      $scope.getFilter = function(event) {
        $scope.divColor = colorService.getColor();
        console.log('Event Fired');
      };
    });
    sampleApp.service('colorService', function() {
      this.getColor = function() {
        return "blue"; //Call Actual Service to Get Color
      };
});

获取div的背景颜色 - AngularJs？

3 个答案: