Question

大家好，我有一个问题要更改ng-repeat中的type值

这是一个简单的例子，解释我想说的

let arr = 
[
  {school_id: 1, name: "jon"},
  {school_id: 2, name: "sam"},
  {school_id: 1, name: "sara"},
  {school_id: 2, name: "youfiy"}
]

<ul>
   <li ng-repeat="arr">arr.school_id</li> <!-- here shuld print school name instide of schoolid -->
</ul>

我需要在 id 1 中将school_id更改为"primarySchool"，在 id 2 中将其更改为"hightSchool"，依此类推

Answer 1

使用 ng-switch 并根据需要添加条件，

var app = angular.module('test',[]);

app.controller('testCtrl',function($scope){

$scope.arr = 
[
  {school_id: 1, name: "jon"},
  {school_id: 2, name: "sam"},
  {school_id: 1, name: "sara"},
  {school_id: 2, name: "youfiy"}
];

});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="test" ng-controller="testCtrl">
<ul>
   <li ng-repeat="schooldObj in arr"> 
     <div ng-switch on="schooldObj.school_id">
      <div ng-switch-when="1">
         PrimarySchool
      </div>
    <div ng-switch-default>
        hightSchool
    </div>
</div>
 </ul>
</body>

Answer 2

您需要某种IF语句，我建议将ID 1和2的简单三元运算符作为唯一选择。这是它的样子：

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.arr = [{
      school_id: 1,
      name: "jon"
    },
    {
      school_id: 2,
      name: "sam"
    },
    {
      school_id: 1,
      name: "sara"
    },
    {
      school_id: 2,
      name: "youfiy"
    }
  ]
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="myCtrl">

    <ul>
      <li ng-repeat="school in arr">
        {{ "test/" + ((school.school_id==1) ? "primarySchool" : "hightSchool") + "&" + school.name}}
      </li>
    </ul>

  </div>

</body>

</html>

甚至更好：只需调用一个将返回所需字符串的函数即可。您可以在其中包含多个if语句，可以随时使用任何逻辑对其进行扩展。

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.arr = [{
      school_id: 1,
      name: "jon"
    },
    {
      school_id: 2,
      name: "sam"
    },
    {
      school_id: 1,
      name: "sara"
    },
    {
      school_id: 2,
      name: "youfiy"
    }
  ]
  $scope.getURL = function(school) {
    var s = "";
    if (school.school_id == 1) {
      s = "primarySchool";
    } else if (school.school_id == 2) {
      s = "hightSchool";
    }
    return "test/" + s + "&" + school.name;
  }
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="myCtrl">

    <ul>
      <li ng-repeat="school in arr">
        {{ getURL(school) }}
      </li>
    </ul>

  </div>

</body>

</html>

Answer 3

$scope.arr = 
[
    {school_id: 1, name: "jon"},
    {school_id: 2, name: "sam"},
    {school_id: 1, name: "sara"},
    {school_id: 2, name: "youfiy"}
]
 //then there we are using ng-repeat with ng-if
<ul>
    <li ng-repeat="schoolidobj in arr">
    //here if school_id is 1 then this condition is executed
    <div ng-if="schoolidobj.school_id == '1' ">
     primarySchool
    </div>
    //here if school_id is 2 then this condition is executed
    <div ng-if="schoolidobj.school_id == '2' ">
     highSchool
    </div>
    </li> 
</ul>

ng-if上ng-repeat值angular js

3 个答案: