내 함수가 배열의 첫 번째 객체 만 반환하는 이유

Question

학생 주최자 웹 앱용 메모 모듈을 작성 중입니다. ID로 객체를 가져 오는 함수를 작성했지만 제대로 작동하지 않거나 코드의 다른 부분에 문제가 있지만이를 파악할 수 없습니다.

이 함수는 범주 및 주제의 이름을 반환해야합니다. 어떻게 든 그것은 범주 & 대상 Array에서 첫 번째 이름 만 반환합니다.

내 시도 :

findMyObjectByID = function (objArray, id) { 
for (const obj of objArray){ 
    if (+obj._ID === +id) { 
    console.log('--------------------'); 
    console.log(obj._ID + ' | ' + id); 
    console.log(obj._Name); 
    console.log('--------------------'); 
    return obj._Name; 
    } else { 
    console.log('--------------------'); 
    console.log(obj._ID + ' | ' + id); 
    console.log('ELSE'); 
    console.log('--------------------'); 
    return 'undefined'; 
    } 
} 
}; 

내가보기없이 빈 프로젝트의 기능을 테스트했다. 여기에 문제 없습니다. https://pastebin.com/n2JZhMGW

HTML/각도 - 형태 &보기
나는 카테고리 및 주제를 선택합니다. 노트 카테고리에는 여러 가지 옵션이 있습니다. 1 & 2는 마감일과 제목 입력 필드가 있고 3은 제목과 텍스트입니다. 그래서 이것은 HTML/Angular 양식과 뷰입니다.

<input type="text" name="title" [(ngModel)] = "Title" placeholder="Titel"> 
<select name="Category" [(ngModel)] = "Category"> 
    <option *ngFor="let category of Categorys" value="{{category._ID}}">{{category._Name}}</option> 
</select> 

<div [ngSwitch]="Category"> 
    <div *ngSwitchCase="1"> 
    <select name="subject" [(ngModel)] = "Subject"> 
     <option *ngFor="let subject of Subjects" value="{{subject._ID}}">{{subject._Name}}</option> 
    </select> 
    <input type="text" name="deadline" [(ngModel)] = "Enddate" placeholder="Deadline eintragen"> 
    </div> 
    <div *ngSwitchCase="2"> 
    <select name="subject" [(ngModel)] = "Subject"> 
     <option *ngFor="let subject of Subjects" value="{{subject._ID}}"> 
{{subject._Name}}</option> 
    </select> 
    <input type="text" name="deadline" [(ngModel)] = "Enddate" placeholder="Deadline eintragen"> 
    </div> 
</div> 
<hr> 
<div *ngIf="Category == 1 || Category == 2 || Category == 3"> 
    <input type="text" name="note" [(ngModel)] = "Note" placeholder="Notiz"> 
</div> 
<hr> 
    <button (click) = "add()">Save me</button> 
<hr> 
<div class="noteBox"> 
    <h1>Notizen </h1> 
    <div class="note" *ngFor="let note of Notes"> 
    <h2>{{note._Title}}</h2> 
    <span>{{note._DateCreated}} | {{note._CategoryName}}</span> 
    <span>Fach: {{note._SubjectName}} | Ablaufdatum: {{note._Enddate}}</span> 
    <hr> 
    <article> 
     {{note._Content}} 
    </article> 
    </div> 
</div> 

타이프 - & 데이터 객체 생성
selectboxes의 값은 나중에 데이터베이스 ID를 나타내는 것이다 피사체 카테고리 객체의 식별자이다. 이것은 노트 객체의 인스턴스를 만드는 방법입니다.

add = function() { 
// id, title, content, subjectID, subjectName, userID, userName, categoryID, categoryName, dateCreated, enddate 
this.Notes.push(new Note(0, this.Title, this.Note, this.Subject, this.findMyObjectByID(this.Subjects, this.Subject), 0, 'admin', this.Category, this.findMyObjectByID(this.Categorys, this.Category), '2017-05-18', this.Enddate)); 
this.Note = ''; 
this.Title = ''; 
this.Category = 0; 
this.Enddate = ''; 
this.Subject = 0; 
}; 

유용한 정보 : 내 데이터입니다. 데이터 소스가 없기 때문에 데이터는 하드 코딩되어 있습니다.

constructor() { 
    this.addSubjects(); 
    this.addCategorys(); 
    } 

    addSubjects = function() { 
    this.Subjects.push(new Subject(89, 'math')); 
    this.Subjects.push(new Subject(16, 'german')); 
    this.Subjects.push(new Subject(45, 'english')); 
    this.Subjects.push(new Subject(89, 'ped')); 
    }; 

    addCategorys = function() { 
    this.Categorys.push(new Category(45, 'homework')); 
    this.Categorys.push(new Category(13, 'reminder')); 
    this.Categorys.push(new Category(27, 'fastnote')); 
    }; 

전체 app.component.ts 파일 : https://pastebin.com/LrUWYgpX

Answer 1

당신은 루프 내부 return 'undefined'을 가지고 있기 때문에 처음 id가 objArray의 첫 번째 요소 같지 않으면 루프 종료됩니다.

나는이 대답에 대한 루프

findMyObjectByID = function (objArray, id) { 
    for (const obj of objArray) { 
     if (+obj._ID === +id) { 
     console.log(obj._Name); 
     return obj._Name; 
     } 
    } 
    return 'undefined'; 
    }