アングル4プロミスサービス

Question

いくつかのデータを使用するサービスを作成しました。 ITは完全に機能します。問題は、hTMLテンプレートでこれらのデータにパイプを適用して並べ替えることです。ここ は、ここに私のコンポーネント

import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; 
import {AlimentsService} from '../services/aliments.service'; 
import {AlimentsModel} from '../datas/aliments-model'; 
@Component({ 
    selector: 'app-liste', 
    templateUrl: './liste.component.html', 
    styleUrls: ['./liste.component.css'], 
    providers: [AlimentsService] 
}) 
export class ListeComponent implements OnInit { 

    t_aliments: AlimentsModel[]; 
    aliments:AlimentsModel; 

    constructor(private alimentservice: AlimentsService) { 

    } 

    getAliments():void{ 

     //on utilise une promise pour obtenir tous les aliments si on les obtiens on les passent en parametre d'une fonction qui les affecera à notre t_aliments 
     this.alimentservice.getAliments().then(t_aliments => this.t_aliments=t_aliments); 
     console.log(this.t_aliments); 

    } 

    ngOnInit(): void { 
     this.getAliments(); 

    } 

} 

である私のパイプは、私のエラーメッセージがその種が未定義に適用することができている

import {Pipe, PipeTransform} from '@angular/core'; 
import {AlimentsModel} from '../datas/aliments-model'; 

@Pipe ({ 
    name:'sort_aliments' 
}) 

export class AlimentsSortPipe implements PipeTransform { 
    transform(value:AlimentsModel[], args:string):any{ 
     if (args==='ascending') 
     { 
      value.sort(function(a,b){ 
       var nameA = a.nom.toUpperCase(); // ignore upper and lowercase 
       var nameB = b.nom.toUpperCase(); // ignore upper and lowercase 
       if (nameA < nameB) { 
        return -1; 
       } 
       if (nameA > nameB) { 
        return 1; 
       } 
       // names must be equal 
       return 0; 
      }); 
     } 
     else if(args==="descending") 
     { 
      value.sort(function(a,b) 
      { 
       var nameA = a.nom.toUpperCase(); // ignore upper and lowercase 
       var nameB = b.nom.toUpperCase(); // ignore upper and lowercase 
       if (nameA < nameB) { 
        return 1; 
       } 
       if (nameA > nameB) { 
        return -1; 
       } 
       // names must be equal 
       return 0; 
      }); 
     } 
    } 
} 

、ここでは私のtempalteのhtmlです

<div *ngFor="let aliment of t_aliments | sort_aliments:'ascending'" class="list-group"> 
    <a href="#" class="list-group-item "> 
    {{aliment.nom}} <br>{{aliment.quantite}} 
    </a> 
</div> 

です...私のt_alimentsが存在しなかったかのように...しかし、それはパイプなしで使うことができれば存在する...

Answer 1

私は直接私のデータサービスをソートしました。大丈夫です...