Question

我正在尝试显示商品清单ul li。我有两种输入类型，例如array.ul li，我必须同时支持这两种类型。如果我给第一个数组类型列表项应该工作，或者如果我给数组2列表项应该工作，那么数组2现在可以工作，但是如果我给数组1类型，它就不能工作。

如何更改我的代码以支持两种类型？

数组1：

myArray = ["fgtr1",ghyt2","juki3"];

数组2：

myArray = [
{
  mode: 'enable', name: 'ashk'
},
{
  mode: 'disable', name: 'qwer'
}
];

Answer 1

这里的问题是数组中的项目是两种不同的类型。一个是带有键和值的对象，另一个是字符串。

因此，您必须进行某种if语句来检查它是否是对象。

const array1 = ['Test 1', 'Test2', 'Test3'];

const array2 = [
  {
    action: 'disable',
    name: 'Test1'
  },
  {
    action: 'enable',
    name: 'Test2'
  },
];

public get myArrayInput(): Array<any> { 
    // If the items inside the array is NOT object, it means it is something else. 
    return this._myArrayInput.map(item => { 
      if (typeof item !== 'object') { 
        return { 
          action: item, 
          name: item 
        };
      }
      return item; 
    });
  }

如果数组不是对象，它将创建一个对象并将键action和name设置为值item。

但是，您可能想要为操作设置默认值，因此可以将其更改为

return {
  action: item,
  name: item
};

TO

return {
   action: 'disable',
   name: item
};

如何在Angular 2中正确显示列表

1 个答案: