CODEWITHSUNDEEP
javascriptangularjs
user1979727
user1979727

Reputation: 117

How to make table that has different color and css behavior each cell by AngularJS..

I am a beginner of AngularJs programe. I need to make one table and each cell in the table has different color. all the data from the json file. There is a example.

In Html {{b}}

In JS.

   var response = $http.get("api/GeneralSchedule/GeneralSchedule_jsonTemplate.json"
    ).success(function(data,status, headers,config){
      $scope.contexts = data.data;

 }

//json

 {
   data:[
         //first Row.
        {
        columns:[
           {
               "val":"a",
                "under_scope":"false",
               "color":"black"
             },
           {
               "val":"b",
                "under_scope":"false",
               "color":"purple"
           }  
        ]
        },

          // second row.
        {
        columns:[
           {
               "val":"c",
                "under_scope":"true",
               "color":"green"
             },
           {
               "val":"d",
                "under_scope":"true",
               "color":"blue"
           }  
        ]
        }
     ]
}

I just make example. Hope it is not confusing.

So I want to handle under_scope and color with AugularJS, not using JQuery.

Can anyone helps me?

Upvotes: 0

Views: 131

Answers (1)

harishr
harishr

Reputation: 18055

you can use ng-style for this

<tr ng-repeat="row in data">
   <td ng-repeat="col in row.column">
      <span ng-style="{'color': col.color}">{{col.val}}</span>
   </td>
</tr>

ng-style expects short object syntax.

Upvotes: 1

Related Questions