Javascript 从现有属性创建新数组

我有这样一个目标：

export var PROJECT: any = {
    id: "1",
    name: "Hunkemoller",
    teammembers: [
        {
            id: 1,
            name: "Sarah Johnson",
            firstname: "Sarah",
            role: "Manager"
        },
        {
            id: 2,
            name: "Christian Johnson",
            firstname: "Christian",
            role: "Employee"
        }

等等

我正在制作一个应用程序，我想在其中添加一个搜索元素，以便您可以搜索不同的团队成员。我想初始化每个团队成员的所有属性“name”。这是唯一需要过滤的东西

我想到了两种方法：

创建一个新数组，其中只包含项目>团队成员的名称 在里面

只需初始化名称。但我还没有成功

你能帮我做出正确的选择并向我解释我如何才能成功吗？ 我现在甚至不知道如何在现有阵列的基础上创建新阵列。我是这样想的：

var teamMembers = project.teammembers.name();

但是除了这个选项之外，如果我可以在对象之外使用name属性，那将是最好的

我走了这么远（我用的是离子2/角度2）

但它不起作用。我发现错误：无法读取未定义的属性“filter”

---

有人能帮我吗？提前感谢。

您可以使用以下方法创建新的不同阵列：

var项目={
id:“1”，
姓名：“Hunkemoller”，
团队成员：[
{
id:1，
姓名：“莎拉·约翰逊”，
名字：“莎拉”，
角色：“经理”
},
{
id:2，
姓名：“克里斯蒂安·约翰逊”，
名字：“基督徒”，
角色：“员工”
}
]
};
log（project.teammembers.map（函数（项）{return item.name}））您可以使用以下方法创建新的不同阵列：


var项目={
id:“1”，
姓名：“Hunkemoller”，
团队成员：[
{
id:1，
姓名：“莎拉·约翰逊”，
名字：“莎拉”，
角色：“经理”
},
{
id:2，
姓名：“克里斯蒂安·约翰逊”，
名字：“基督徒”，
角色：“员工”
}
]
};
log（project.teammembers.map（函数（项）{return item.name}））
它不应该是
this.project.teammembers.name
，而应该是
this.project.teammembers
，然后在结果过滤器中使用
teammebers.name

if (val && val.trim() != '') {
      this.project.teammembers.name = 
                    this.project.teammembers.filter((teammember) => {
        return (teammember.name.toLowerCase().indexOf(val.toLowerCase()) > -1);
      })
    }

或者你可以尝试这样的方法来过滤名字

this.project.teammembers.name = this.project.teammembers.filter(function(el) {
    return (el.name === val.toLowerCase());
}).map(function(el) {
    return el.firstname;
}).sort();

所以基本上你是通过名字过滤，然后如果你想要一个新的数组，它的名字按顺序排列。。。您可以执行
映射
和
排序
它不应该是
this.project.teammembers.name
，而应该是
this.project.teammembers
，然后在生成的过滤器中使用
teammebers.name

if (val && val.trim() != '') {
      this.project.teammembers.name = 
                    this.project.teammembers.filter((teammember) => {
        return (teammember.name.toLowerCase().indexOf(val.toLowerCase()) > -1);
      })
    }

或者你可以尝试这样的方法来过滤名字

this.project.teammembers.name = this.project.teammembers.filter(function(el) {
    return (el.name === val.toLowerCase());
}).map(function(el) {
    return el.firstname;
}).sort();

所以基本上你是通过名字过滤，然后如果你想要一个新的数组，它的名字按顺序排列。。。您可以执行
映射
和
排序
或使用下划线

或者使用下划线uz.map（）

最终我成功了。
我从头开始，从一个硬编码数组中获取现有对象中的项

对于有相同问题的任何人，这是我的最终代码：

HTML:

我认为project.teammembers.name有点问题。现在有了新的变量“name”，它成功了。非常感谢你们的帮助
 最终我成功了。
我从头开始，从一个硬编码数组中获取现有对象中的项

对于有相同问题的任何人，这是我的最终代码：

HTML:

我认为project.teammembers.name有点问题。现在有了新的变量“name”，它成功了。非常感谢你们的帮助
 谢谢你的快速回复！我不再犯错误了，所以这很好。但它也不会过滤。它仍然显示所有的名字，没有过滤…我明白了，不幸的是代码仍然不能工作。我不确定这里出了什么问题。。没有错误，只是没有过滤下面的名称。感谢您的快速响应！我不再犯错误了，所以这很好。但它也不会过滤。它仍然显示所有的名字，没有过滤…我明白了，不幸的是代码仍然不能工作。我不确定这里出了什么问题。。没有错误，只是没有过滤下面的名称。感谢您的快速响应。很好，现在如何创建新数组：-）我很快就会尝试，但首先我想尝试它，而不创建新数组array@Thalaivar的答案应该能解决你的问题。您筛选了错误的元素。他正在筛选正确的元素（团队成员）。感谢您的快速响应。很好，现在如何创建新数组：-）我很快就会尝试，但首先我想尝试它，而不创建新数组array@Thalaivar的答案应该能解决你的问题。您筛选了错误的元素。他正在筛选正确的元素（团队成员）。
this.project.teammembers.name = this.project.teammembers.filter(function(el) {
    return (el.name === val.toLowerCase());
}).map(function(el) {
    return el.firstname;
}).sort();

var teamMembers = _.map(project.teammembers, function(item){ 
   return item.name 
});

   <ion-searchbar (ionInput)="getNames($event)"></ion-searchbar>
   <ion-list>
      <ion-item *ngFor="let name of names">
         {{ name }}
      </ion-item>
   </ion-list>

export class Page1 {
    names;
}

constructor () {
    this.initializeNames();
}

initializeNames() {
    this.names = this.project.teammembers.map(function(item){ return item.name }); // Thanks a lot Amir for this !
  }

getNames(ev) {
    // Reset items back to all of the items
    this.initializeNames();

    // set val to the value of the searchbar
    let val = ev.target.value;

    // if the value is an empty string don't filter the items
    if (val && val.trim() != '') {
      this.names = this.names.filter((item) => {
        return (item.toLowerCase().indexOf(val.toLowerCase()) > -1);
      })
    }
  }