Question

对于某人来说，这可能是一个简单的答案。我目前正在使用过滤器函数detailFilter将数组过滤到单个对象，但我不确定如何包装和绑定html。所以我使用了ng-repeat，即使每次调用只会“重复”一次（见下文）。做我想做的事的正确方法是什么？

<ul class="skill-bar">
    <li>
        <p data-ng-repeat="item in branchmasterdata | filter:detailFilter">Revenue {{ item.RevenueVal | currency }}</p>
        <div class="meter"><span data-percent="40" class="lightBlue">40%</span></div>
    </li>
    <li>
        <p data-ng-repeat="item in branchmasterdata | filter:detailFilter">OEC on Rent {{ item.OECVal | currency }}</p>
        <div class="meter"><span data-percent="80" class="blue">70%</span></div>
    </li>
    <li>
        <p data-ng-repeat="item in branchmasterdata | filter:detailFilter">Unit Count {{ item.UnitCountVal }}</p>
        <div class="meter"><span data-percent="80" class="green">80%</span></div>
    </li>
    <li>
        <p data-ng-repeat="item in branchmasterdata | filter:detailFilter">New Accounts {{ item.NewAccountsVal }}</p>
        <div class="meter"><span data-percent="100" class="red">100%</span></div>
    </li>
    <li>
        <p data-ng-repeat="item in branchmasterdata | filter:detailFilter">Average Discount {{ item.AvgDiscountVal }}</p>
        <div class="meter"><span data-percent="60" class="lightOrange">60%</span></div>
    </li>

</ul>

Answer 1

您可以在控制器本身中应用过滤器。

 for (i = 0; i < $scope.branchmasterdatain.length; i++) {

//您的过滤器代码}

我希望这可以帮助你...

Answer 2

我最终创建了一个名为selectedSalesRep的单独$ scope属性，并且能够隔离所选项目。因此，我根本不需要过滤器。应该想到这一点。

<ul class="skill-bar">
        <li>  
            <p>Revenue </p>
            <div class="meter"><span data-percent="80" class="lightBlue">{{ selectedSalesRep.RevenueVal | currency }}</span></div>
        </li>
        <li>
            <p>OEC on Rent {{ selectedSalesRep.OECVal | currency }}</p>
            <div class="meter"><span data-percent="80" class="blue">70%</span></div>
        </li>
        <li>
            <p>Unit Count {{ selectedSalesRep.UnitCountVal }}</p>
            <div class="meter"><span data-percent="80" class="green">80%</span></div>
        </li>
        <li>
            <p>New Accounts {{ selectedSalesRep.NewAccountsVal }}</p>
            <div class="meter"><span data-percent="100" class="red">100%</span></div>
        </li>
        <li>
            <p>Average Discount {{ selectedSalesRep.AvgDiscountVal }}</p>
            <div class="meter"><span data-percent="60" class="lightOrange">60%</span></div>
        </li>

    </ul>

用于将单个数组项与过滤器绑定的AngularJS方法

2 个答案: