Question

我的控制器使用与学生信息（StudentName和FavoriteDay）相关的json填写$ scope.gridData。

<table>
        <thead>
            <tr>
                <td><b>Format</b></td>
                <td><b>Day of Month</b></td>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="i in gridData">
                <td>{{i.StudentName}}</td>
                <td>{{i.FavoriteDay}}</td> <--
            </tr>
        </tbody>

我从SQL获得的FavoriteDay值是1到7号。但是我想用星期一，星期二这样的实际天数替换它们。所以我有这样的功能

 function changeToDay(day) {
  if (day == '1') return 'Monday'
  if (day == '2') return 'Tuesday'
  ...
  }

用这个

替换了html

  <td> {{changeToDay(i.Favorite)}} </td>

但这似乎不起作用。

请建议正确的方法？

Answer 1

您的功能不在范围内，您可以删除所有ifs语句并执行以下操作：

var days = ['sunday','monday']....;

$scope.changeToDay = function(day) {
  return days[day];
}

<td> {{changeToDay(i.Favorite)}} </td>

或者，如果由于某种原因，阵列结构对您的结构没有意义，您可以按照自己的意愿编写它。

Answer 2

使用范围函数没有任何问题，但Angular有一个抽象，称为过滤器。

app.filter('day', function() {
  var text = ['Sunday', 'Monday', ...];
  return function(day) {
    return text[day];
  };
});

然后您可以在应用中使用全球：

<td> {{ i.Favorite | day }} </td>

AngularJS中的客户端模板

2 个答案: