Javascript 使用ng repeat和ng if进行代码优化

各位早上好,

我有一张这样的桌子：

该表的代码为：

<tr ng-repeat="item in captions | filter:search:strict">
    <td>{{item.CodeId}}</td>
    <td>{{item.EnumCaption}}</td>
    <td>
        <p ng-repeat="language in item.languages" 
             ng-if="language.CodeLanguage=='nl' && language.CodeCountry=='BE'">
            <a href="#" 
                onaftersave="updateCaption(language)"
                editable-textarea="language.Caption" 
                e-cols="25" 
                e-rows="{{(language.Caption.length/25)+3}}">{{language.Caption}}</a>
        </p>
    </td>
    <td>
        <p ng-repeat="language in item.languages" 
             ng-if="language.CodeLanguage=='en' && language.CodeCountry=='GB'">
            <a href="#" 
                onaftersave="updateCaption(language)"
                editable-textarea="language.Caption" 
                e-cols="25" 
                e-rows="{{(language.Caption.length/25)+3}}">{{language.Caption}}</a>
        </p>
    </td>
    <td>
        <p ng-repeat="language in item.languages" 
             ng-if="language.CodeLanguage=='fr' && language.CodeCountry=='BE'">  
            <a href="#" 
                onaftersave="updateCaption(language)"
                editable-textarea="language.Caption" 
                e-cols="25" 
                e-rows="{{(language.Caption.length/25)+3}}">{{language.Caption}}</a>
        </p>
    </td>
    <td>
        <p ng-repeat="language in item.languages" 
             ng-if="language.CodeLanguage=='de' && language.CodeCountry=='DE'">
            <a href="#" 
                onaftersave="updateCaption(language)"
                editable-textarea="language.Caption" 
                e-cols="25" 
                e-rows="{{(language.Caption.length/25)+3}}">{{language.Caption}}</a>
        </p>
    </td>

</tr>

事实上，我想避免每次使用ng if重复ng。我不知道是否有方法来验证数据并在正确的位置填充每个数据，因为有时候JSON对象上存在一种语言，有时候不存在

正如我所说，我的代码正在工作，我只是在寻找一个优化

---

谢谢：）

因为我看到你有静态列，所以你可以按需要的顺序为它创建数组

ng-init="lang = ['nl-BE', 'en-GB','fr-BE','de-DE']"

然后在其上重复，并从数组中呈现所需的元素

<td ng-repeat="la in lang"
    ng-init="l = lang[$index].split('-'); language=(item.languages|filter:{CodeLanguage:l[0], CodeCountry:l[1]})[0]">
    <p ng-if="language">
        <a href="#" onaftersave="updateCaption(language)" editable-textarea="language.Caption" e-cols="25" e-rows="{{(language.Caption.length/25)+3}}">{{language.Caption}}</a>
    </p>
</td>

td{
边框：1px纯黑；
}

{{la}}
{{item.CodeId}
{{item.EnumCaption}

只需移动

ng repeat

到

td

@Grundy和ng if条件即可？我想把每个字段放在正确的位置上，只有ng重复。你应该有一个ng重复和一个td@Grundy我没有得到你的评论。。如果我在没有

ng If

的情况下执行

ng repeat

，如果语言顺序不一致，会发生什么？或者如果没有四种语言？是的：-）我错过了：-）所以，你可以做一些准备：只需按需要的顺序收集语言，然后重复。如果你能提供样品，我可以展示一些具体的东西

<td ng-repeat="la in lang"
    ng-init="l = lang[$index].split('-'); language=(item.languages|filter:{CodeLanguage:l[0], CodeCountry:l[1]})[0]">
    <p ng-if="language">
        <a href="#" onaftersave="updateCaption(language)" editable-textarea="language.Caption" e-cols="25" e-rows="{{(language.Caption.length/25)+3}}">{{language.Caption}}</a>
    </p>
</td>