首页 > 解决方案 > Angular:是否可以在循环模板内创建变量?

问题描述

我的模板中有一个 *ngFor,我想在每个项目上调用一个函数。该函数返回一个包含三个值的对象,我想在模板中显示这些值。现在的问题是我调用该函数三次以显示对象的所有属性。

我想要做的是将结果绑定到一个变量,这样我就可以使用该变量而不是调用该函数 3 次。所以我想要实现的是以下内容:

var lists = [['a', 'b', 'c'], ['k', 'd', 't']];

function addx(letters){
    return {
    'item1': letters[0] + 'x',
    'item2': letters[1] + 'x',
    'item3': letters[2] + 'x',
  }
}

for(var i=0; i<lists.length; i++){
    var a = addx(lists[i])
  console.log(a.item1);
  console.log(a.item2);
  console.log(a.item3);
}

标签: angular

解决方案


也许我还没有完全理解你想要什么,但不是一个简单的“地图”吗?具体来说

let newList = lists.map(addx);

您可以将其newList用于您的 ngFor

var lists = [['a', 'b', 'c'], ['k', 'd', 't']];

function addx(letters){
    return {
    'item1': letters[0] + 'x',
    'item2': letters[1] + 'x',
    'item3': letters[2] + 'x',
  }
}

var newList = lists.map(addx);
console.log(newList);


推荐阅读