Angular2 удаляет дубликаты из массива JSON

У меня проблема с фильтром в моем массиве JSON при переносе приложения на Angular2. В Angular 1.x это было проще. я использовал'unique' в фильтре, и это удаляет все дубликаты.

Программы:

{"app":"database_1",
 "host":"my_host1",
 "ip":"00.000.00.000"
},
{"app":"database_1",
 "host":"my_host1",
 "ip":"00.000.00.000"
},
{"app":"database_2",
 "host":"my_host2",
 "ip":"00.000.00.000"
},
{"app":"database_2",
 "host":"my_host2",
 "ip":"00.000.00.000"
}

Часть HTML-кода:

    <div *ngFor='#appsUnique of apps '>
        <div class="row dashboard-row">
            <div class="col-md-2">
               <h4>{{appsUnique.app }}</h4>
            </div>
        </div>
    </div>

И результат:

database_1
database_1
database_2
database_2

Я хочу получить результат:

database_1
database_2

Как я могу удалить дубликаты из массива?

 pramod kadam21 июл. 2016 г., 13:28
Как и в angular2, фильтры заменены на трубы, а некоторые фильтры недоступны в angular2. Вы можете написать собственный @Pipe для фильтрации массива. и для обработки массива также полезен lodash js.
 notsaltydev21 июл. 2016 г., 13:35
Спасибо за ответ, я нашел похожую тему:stackoverflow.com/questions/34417250/...

Ответы на вопрос(6)

Вы можете использовать следующий метод:

names = ["Mike","Matt","Nancy","Adam","Jenny","Nancy","Carl"];

ngOnInit() {
    let filteredNames=this.remove_duplicates(this.names);
    console.log(filteredNames);
    console.log(this.names);
}
remove_duplicates(arr) {
    let obj = {};
    for (let i = 0; i < arr.length; i++) {
        obj[arr[i]] = true;
    }
    arr = [];
    for (let key in obj) {
        arr.push(key);
    }
    return arr;
}

Надеюсь это поможет.

trackBy.

Попробуйте с:

*ngFor="#appsUnique of posts;trackBy:appsUnique?.app"

Надеюсь, поможет.

 notsaltydev21 июл. 2016 г., 13:29
спасибо за ответ, но это не имеет никакого влияния.
 notsaltydev21 июл. 2016 г., 13:58
У меня есть angular2-2.0.0-beta.15 и когда я использую ваш код (*ngFor="#appsUnique of apps;trackBy:appsUnique?.app), результат такой же, как и в начале.
 Gopinath Shiva21 июл. 2016 г., 13:00
Я пытался использовать trackBy, но не смог добиться этого. ты можешь экспериментировать здесьfiddle.jshell.net/1y0tw6zf/53
 Florian Neiss24 апр. 2018 г., 08:48
это не работает с angular4
 alejandromav21 июл. 2016 г., 14:02
Вы можете увидеть больше деталейВот
 alejandromav21 июл. 2016 г., 13:37
trackBy был добавлен в бета-версии 3. Возможно, вы используете предыдущую версию.чирикать

это очень просто.

let filteredData = [];
let arrayData = [{
  "app": "database_1",
  "host": "my_host1",
  "ip": "00.000.00.000"
},
{
  "app": "database_1",
  "host": "my_host1",
  "ip": "00.000.00.000"
},
{
  "app": "database_2",
  "host": "my_host2",
  "ip": "00.000.00.000"
},
{
  "app": "database_2",
  "host": "my_host2",
  "ip": "00.000.00.000"
}];

Observable.merge(arrayData)
  .distinct((x) => x.app)
  .subscribe(y => {
    filteredData.push(y)
    console.log(filteredData)
  });
 Nishant Singh21 февр. 2018 г., 10:06
Я тоже хотел получить уникальные объекты из массива объектов, сравнивая конкретную переменную объекта. Я перепробовал все доступные решения, но только это сработало для меня. Благодарю.

чтобы зацикливаться на обычном массиве json, вы можете создать другой массив в вашем соответствующем классе машинописи и изменить его по своему усмотрению. В вашем HTML, вы можете иметь следующее

HTML
 <div *ngFor='let appsUnique of filteredApps'>
    <div class="row dashboard-row">
        <div class="col-md-2">
           <h4>{{appsUnique.app }}</h4>
        </div>
    </div>
</div>

Затем вам нужен этот массив FilterApps в вашем соответствующем классе машинописи.

машинопись
 let filteredApps = [];

и в функции вы можете затем создать это FilterApps, например, вonInit метод.

onInit()
{
    filteredApps = // filter logic
}

Mybe это может помочь вам

myList = ["One","two","One","tree"];

myNewList =  Array.from(new Set(myList ));
Решение Вопроса

У меня есть решение этой проблемы :)

Array.from(new Set([{"app":"database_1",
 "host":"my_host1",
 "ip":"00.000.00.000"
},
{"app":"database_1",
 "host":"my_host1",
 "ip":"00.000.00.000"
},
{"app":"database_2",
 "host":"my_host2",
 "ip":"00.000.00.000"
},
{"app":"database_2",
 "host":"my_host2",
 "ip":"00.000.00.000"
}].map((itemInArray) => itemInArray.app)))

Подробнее о Array.from & Set

Спасибо всем за помощь :)

Ваш ответ на вопрос