Javascript AngularJS将类添加到<;td>;从数据库中通过ngRepeat生成动态

Javascript AngularJS将类添加到<;td>;从数据库中通过ngRepeat生成动态,javascript,php,html,angularjs,angularjs-ng-repeat,Javascript,Php,Html,Angularjs,Angularjs Ng Repeat,我的桌子有问题,因为我不知道怎么做 我有一个html表格,它是用数据库中的数据动态生成的,现在我需要向td元素添加一些样式。风格,我需要添加,我已经从数据库(背景颜色在rgb),但我不知道如何 下面是在视图中按角度生成的代码: <table class="table table-bordered table-hover table-striped"> <thead> <tr> <th>Lp.</

我的桌子有问题,因为我不知道怎么做

我有一个html表格,它是用数据库中的数据动态生成的,现在我需要向td元素添加一些样式。风格,我需要添加,我已经从数据库(背景颜色在rgb),但我不知道如何

下面是在视图中按角度生成的代码:

<table class="table table-bordered table-hover table-striped">
    <thead>
        <tr>
            <th>Lp.</th>
            <th>image</th>
            <th>Article name:</th>
            <th>Colors in article:</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">1</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">2</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">3</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">4</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">5</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">6</th>
            <th class="ng-binding ng-scope" ng-repeat="y in [] | range:0:number">7</th>
        </tr>
    </thead>
    <tbody>
        <tr class="ng-scope" ng-repeat="pokayoke in pokayokes | filter : search track by $index">
            <td class="ng-binding">1</td>
            <td>obrazek</td>
            <td ng-repeat="column in pokayoke" class="11_14_1167"><p class="ng-binding">11_14_1167</p></td>
            <td ng-repeat="column in pokayoke" class="C,M,Y,K,P286,P218"><p class="ng-binding">C,M,Y,K,P286,P218</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>
            <td ng-repeat="column in pokayoke" class="C"><p class="ng-binding">C</p></td>
            <td ng-repeat="column in pokayoke" class="C"><p class="ng-binding">C</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>

        </tr>
        <tr class="ng-scope" ng-repeat="pokayoke in pokayokes | filter : search track by $index">
            <td class="ng-binding">2</td>
            <td>obrazek</td>
            <td ng-repeat="column in pokayoke" class="11_14_1171"><p class="ng-binding">11_14_1171</p></td>
            <td ng-repeat="column in pokayoke" class="C,M,Y,K,P286,P7465"><p class="ng-binding">C,M,Y,K,P286,P7465</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>
            <td ng-repeat="column in pokayoke" class="x"><p class="ng-binding">x</p></td>
            <td ng-repeat="column in pokayoke" class="Y"><p class="ng-binding">Y</p></td>
            <td ng-repeat="column in pokayoke" class="Y"><p class="ng-binding">Y</p></td>
            <td ng-repeat="column in pokayoke" class="Y"><p class="ng-binding">Y</p></td>
            <td ng-repeat="column in pokayoke" class="Y"><p class="ng-binding">Y</p></td>
            <td ng-repeat="column in pokayoke" class="Y"><p class="ng-binding">Y</p></td>

        </tr>
    </tbody>
</table>

Lp。
形象
物品名称:
文章中的颜色:
1.
2.
3.
4.
5.
6.
7.
1.
奥布拉泽克

11\u 14\u 1167

C、M、Y、K、P286、P218

x

x

C

C

x

x

x

2. 奥布拉泽克

11\u 14\u 1171

C、M、Y、K、P286、P7465

x

x

Y

Y

Y

Y

Y

生成上表的代码:

<table class="table table-bordered table-hover table-striped">
        <thead>
            <tr>
                <th>Lp.</th>
                <th>image</th>
                <th>Article name:</th>
                <th>Colors in article:</th>
                <th ng-repeat="y in [] | range:0:number">{{$index+1}}</th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="pokayoke in pokayokes | filter : search track by $index">
                <td>{{$index+1}}</td>
                <td>obrazek</td>
                <td ng-repeat="column in pokayoke" class="{{ column }}"><p>{{ column }}</p></td>
            </tr>
        </tbody>
</table>

Lp。
形象
物品名称:
文章中的颜色:
{{$index+1}}
{{$index+1}}
奥布拉泽克
{{column}}

现在我需要从类的数据库中获取值,从第5列到最后一列,再到rgb中的每个添加背景样式。 我不知道这整个过程是怎么回事。。。在angular或php站点中。 如果有人写信给我,我会非常高兴。这一步应该是什么样子的…:)

编辑29.10.15: 数据库表的打印屏幕:

  • 在表中获取数据的表:

  • 我上课的表格:

  • 还有一行的示例代码,我希望最后是什么样子:

    <tr class="ng-scope" ng-repeat="pokayoke in pokayokes | filter : search track by $index">
                <td class="ng-binding">1</td>
                <td>obrazek</td>
                <td ng-repeat="column in pokayoke" class="11_14_1167"><p class="ng-binding">11_14_1167</p></td>
                <td ng-repeat="column in pokayoke" class="C,M,Y,K,P447,P218"><p class="ng-binding">C,M,Y,K,P447,P218</p></td>
                <td ng-repeat="column in pokayoke" class="P447" style="background-color: rgb(39,46,32)"><p class="ng-binding">P447</p></td>
                <td ng-repeat="column in pokayoke" class="P447" style="background-color: rgb(39,46,32)"><p class="ng-binding">P447</p></td>
                <td ng-repeat="column in pokayoke" class="K" style="background-color: rgb(0,0,0)"><p class="ng-binding">K</p></td>
                <td ng-repeat="column in pokayoke" class="K" style="background-color: rgb(0,0,0)"><p class="ng-binding">K</p></td>
                <td ng-repeat="column in pokayoke" class="x" style="background-color: rgb(255,255,255)"><p class="ng-binding">x</p></td>
                <td ng-repeat="column in pokayoke" class="x" style="background-color: rgb(255,255,255)"><p class="ng-binding">x</p></td>
                <td ng-repeat="column in pokayoke" class="x" style="background-color: rgb(255,255,255)"><p class="ng-binding">x</p></td>
    </tr>
    
    
    1.
    奥布拉泽克
    

    11\u 14\u 1167

    C、M、Y、K、P447、P218

    P447

    P447

    K

    K

    x

    x

    x


    该类不是必需的,我只需要内联添加样式。

    我正在简化它,假设您将颜色名称保存在DB中,假设您有一个简单的obj,如下所示:

      $scope.items = [{
        "color":"red",
        "value":12
      },{
        "color":"green",
        "value":12
      },{
        "color":"blue",
        "value":12
      },{
        "color":"pink",
        "value":12
      }];
    
    然后在HTML中,你可以像这样添加内联样式

    <table>
          <tr ng-repeat="item in items" style="background:{{item.color}}"><td>{{item.value}}</td></tr>
    </table>
    
    
    {{item.value}}
    
    希望这能解决你的问题


    我正在简化它,假设您将颜色名称保存在DB中,假设您有一个简单的obj,如下所示:

      $scope.items = [{
        "color":"red",
        "value":12
      },{
        "color":"green",
        "value":12
      },{
        "color":"blue",
        "value":12
      },{
        "color":"pink",
        "value":12
      }];
    
    然后在HTML中,你可以像这样添加内联样式

    <table>
          <tr ng-repeat="item in items" style="background:{{item.color}}"><td>{{item.value}}</td></tr>
    </table>
    
    
    {{item.value}}
    
    希望这能解决你的问题


    但我在td元素中已经有一个ngRepeat循环,我可以在同一元素中有多个ngRepeat循环吗?一个循环用于不同的范围?你能分享你的数据库的结构和你想要达到的最终结果吗?我编辑了问题并添加了数据库的结构和我想要它的样子的简单示例。但我已经在td元素中有一个ngRepeat循环,我能在同一元素中有多个吗?不同范围的一个循环?你能分享你的数据库的结构和你想要达到的最终结果吗?我编辑了问题并添加了数据库的结构和我想要它的样子的简单示例。