首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在函数调用中使用ng-class -被多次调用

在函数调用中使用ng-class -被多次调用
EN

Stack Overflow用户
提问于 2014-11-18 18:36:57
回答 1查看 60.6K关注 0票数 18

我正在使用Ionic,并希望根据数据动态更改<ion-list>中每个项目的背景色。我想我应该通过函数调用的方式来返回正确的类

<ion-list>
  <ion-item ng-repeat="singleCase in allCases" ng-class="getBackgroundColour(singleCase)" class="item-avatar">
    <h2>{{singleCase.date}}</h2>
    <p>{{singleCase.caseType}}</p>
  </ion-item>
</ion-list>

这是目前的控制器

  .controller('AllCasesCtrl', ['$scope', '$log', 'dummyData', function($scope, $log, dummyData) {
    $scope.allCases = dummyData.cases;

    $scope.getBackgroundColour = function(singleCase){

      $log.log("getBackgroundColour called...singleCase type: " + singleCase.speciality);

      var colourMap = {
        speciality1: "speciality1Class",
        speciality2: "speciality2Class",
        speciality3: "speciality3Class"
      };

      return colourMap[singleCase.speciality];
    };

  }])

在检查控制台时,列表中的每个<ion-item>都会调用7次getBackgroundColour()函数。为什么会这样?我应该避免在ng-class中使用函数调用吗?

EN

回答 1

Stack Overflow用户

发布于 2014-11-18 18:57:22

只要你的列表不是很大,你的方式就可以。也就是说,如果您使用的是angular 1.3,并且希望减少调用次数,那么可以将ng-class更改为ng-class="::getBackgroundColour(singleCase)“。这适用于一次绑定,因此一旦该值稳定,它将不会再次检查。这很可能意味着每个项目有两个呼叫。

票数 8
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/26992193

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档