ng-repeat : 객체 배열의 각에 대한 액세스 키 및 값
object-의 배열 나는을 가지고 있고 그것을 ng-repeat
반복 하기 위해 사용하고 있습니다. 배열은 다음과 가변합니다.
$scope.steps = [
{companyName: true},
{businessType: true},
{physicalAddress: true}
];
그리고 내 ng-repeat
속성은 다음과 가변합니다.
<div ng-repeat="step in steps"> ... </div>
각 반복에서 예상 step
대로 수업 중 하나와 가변합니다. 어쨌든 step
모든 액세스 할의 키와 값에 모두 액세스 할 수 있습니까? 그래서 다음과 같이 할 수 있습니다.
<div ng-repeat="(stepName, isComplete) in steps"> ... </div>
여기서 stepName
== 'companyName'
및 isComplete
== true
. 이 작업을 시도했지만 stepName
항상 단계 개체의 보안이 적용 됩니다. ng-repeat
키와 값을 얻을 수있는 구문 을 작성하는 다른 방법이 있는지 알아 내고 합니다.
모든 아이디어 / 제안에 감사드립니다. 매우 감사합니다.
추신. 내 현재 해결 방법은 컨트롤러 에서이 작업을 수행하는 것입니다.
$scope.stepNames = [];
angular.forEach($scope.steps, function(isComplete, stepName){
$scope.stepNames.push({stepName: stepName, isComplete: isComplete});
});
그런 다음이를 반복하지만 뷰에서 모든 작업을 수행하는 것이 좋습니다.
중계기 내부의 중계기
<div ng-repeat="step in steps">
<div ng-repeat="(key, value) in step">
{{key}} : {{value}}
</div>
</div>
사실, 데이터는 잘 설계되지 않습니다. 다음과 같은 것을 사용하는 것이 좋습니다.
$scope.steps = [
{stepName: "companyName", isComplete: true},
{stepName: "businessType", isComplete: true},
{stepName: "physicalAddress", isComplete: true}
];
그러면 원하는 작업을 쉽게 수행 할 수 있습니다.
<div ng-repeat="step in steps">
Step {{step.stepName}} status : {{step.isComplet}}
</div>
예 : http://jsfiddle.net/rX7ba/
이것이 당신을위한 옵션 인 경우에, 당신이 당신의 데이터를 형태로 갖추고면 당신이 바라는대로 작동합니다 :
$scope.steps = {
companyName: true,
businessType: true,
physicalAddress: true
};
여기에 이것의 바이올린이 있습니다 : http://jsfiddle.net/zMjVp/
한 방식에 문제는 데이터를 디자인합니다. 의미론에서 나에게 그것은 의미가 없습니다. 단계는 정확히 무엇입니까?
한 회사의 정보를 저장하고?
이 경우 단계는 선언하고 (KayakDave의 답변 참조) 각 "단계"는 클래스 속성이어야합니다.
여러 회사의 정보를 저장합니까?
이 경우 단계는 객체의 배열이어야합니다.
$scope.steps=[{companyName: true, businessType: true},{companyName: false}]
두 경우 모두 한 번 (두 번째 경우 두 번) ng-repeat로 데이터를 쉽게 반복 할 수 있습니다.
반복기를 중첩 할 필요가없는 또 다른 방법이 있습니다.
로부터 AngularJS와 문서 :
다음 구문을 사용하여 ngRepeat를 가져와 객체의 속성을 반복 할 수 있습니다.
<div ng-repeat="(key, value) in steps"> {{key}} : {{value}} </div>
Angular 1.3.12에서 더 이상 내부 ng-repeat가 필요하지 않은 것처럼 보이며 외부 루프는 컬렉션의 값을 반환하는 단일 맵 항목입니다.
'ProgramingTip' 카테고리의 다른 글
Bash에서 함수 정의를 인쇄하는 방법은 무엇입니까? (0) | 2020.12.07 |
---|---|
file_put_contents () 실행시 폴더 생성 (0) | 2020.12.07 |
Node.js / Express 앱에 DB 구성을 저장하는 가장 좋은 방법 (0) | 2020.12.07 |
gradle.properties 파일을 위치 위치 (0) | 2020.12.07 |
Cloud Foundry와 Docker의 차이점은 무엇입니까? (0) | 2020.12.07 |