웹개발 및 최신 테크 소식을 전하는 블로그, 웹이즈프리
AngularJS에서 객체 또는 배열에 반복문을 사용하는 방법에 대하여 알아봅니다. 많이 사용되는 for문 외에 key, value로 객체의 프로퍼티를 반복하여 실행하는 반복문 사용이 가능한 forEach() 구문을 사용할 수 있습니다. 아래는 간단한 사용방법입니다.
각각의 프로퍼티 값들이 forEach()를 사용하여 출력되었습니다. 이처럼 forEach()를 사용하여 간단한 반복문을 수행할 수 있습니다.
출력결과입니다.
이처럼 배열이 가진 값을 모두 출력하게 됩니다.
forEach(items, function(key, value) {
// Code here
});
// Code here
});
# AngularJS 반복문 forEach() 예제보기
그럼 간단한 예제를 만들어 알아보겠습니다. 만약 객체 mySite가 있고 그 프로퍼티들을 출력하는 경우 아래와 같이 사용할 수 있습니다.mySite = {
'web': 'a',
'is': 'b',
'free': 'c'
}
forEach(mySite, function(key, value) {
console.log(mySite[value]);
})
실행하면 각각의 프로퍼티 값들이 아래와 같이 출력됩니다.'web': 'a',
'is': 'b',
'free': 'c'
}
forEach(mySite, function(key, value) {
console.log(mySite[value]);
})
a
b
c
b
c
각각의 프로퍼티 값들이 forEach()를 사용하여 출력되었습니다. 이처럼 forEach()를 사용하여 간단한 반복문을 수행할 수 있습니다.
# 배열에 대하여 forEach()문 사용하기, Array
배열 역시 동일하게 사용할 수 있습니다. 아래 예제를 봐주세요.var test = [1, 2, 3];
angular.forEach(test, function(value) {
console.log(value);
});
console.log(value);
});
출력결과입니다.
1
2
3
이처럼 배열이 가진 값을 모두 출력하게 됩니다.
아래의 글도 찾고 계시지 않나요?
- 자바스크립트를 사용하여 input 태그에 한글 입력 막기, 한글 불가 방법
php에서 http header 403 에러를 리턴하는 방법- Python jinja 템플릿 for 루프 사용시 cycle 메서드 사용하기
- [scss] 리스트 타입 선언 방법과 반복문 사용하기, @each
Python range() 함수, 반복문 및 배열 만들기
HTML form태그를 사용하여 입력폼 만들기 및 예제
[VueJS] vue-for 반복문 알아보기
자바스크립트 ajax를 사용하여 비동기 방식 파일 업로드 예제
자바스크립트 for 반복문 약식 표현 예제보기
자바스크립트 while 반복문 예제 및 정보