홈>
혼란이 있다면 죄송합니다. 이것은 첫 번째 이온 프로젝트입니다. 그래서 데이터 배열이 있습니다 (행 위의 내용은 홈페이지이고 아래는 첫 번째 하위 페이지입니다)
this.cities = [
{
name: 'Miami',
shortName: 'Mi',
events: '12',
news: '15',
weather: '29',
crimeAlert: 'n',
crimeAlertTitle: '',
crimeAlertBody: '',
newsItems: [{
name: 'someNewsItem 1',
imaged: 'y',
image: 'im here',
body: 'Miami someBody 1'
},{
name: 'someNewsItem 2',
imaged: 'y',
image: 'im here',
body: 'Miami someBody 2'
}],
eventItems: [{
name: 'someEventItem 1',
imaged: 'y',
image: 'im here',
body: 'Miami someBodyEvent 1'
}]
}, ...
];
goToCityPage(c) {
this.navCtrl.push(CityViewPage, {
'name': c.name,
'shortName': c.shortName,
'events': c.events,
'news': c.news,
'weather': c.weather,
'crimeAlert': c.crimeAlert,
'crimeAlertTitle': c.crimeAlertTitle,
'crimeAlertBody': c.crimeAlertBody,
'newsItems': c.newsItems,
'newsItemsName': c.newsItems.name,
'newsItemsBody': c.newsItems.body,
'newsItemsImaged': c.newsItems.imaged,
'newsItemsImage': c.newsItems.image,
'eventItems': c.eventItems,
'eventItemsName': c.eventItems.name,
'eventItemsBody': c.eventItems.body,
'eventItemsImage': c.eventItems.image,
'eventItemsImaged': c.eventItems.imaged
});
}
______________________________________________________
constructor(public navCtrl: NavController, public navParams: NavParams) {
this.city = this.navParams.get('name');
this.cityShort = this.navParams.get('shortName');
this.events = this.navParams.get('events');
this.news = this.navParams.get('news');
this.weather = this.navParams.get('weather');
this.crimeAlert = this.navParams.get('crimeAlert');
this.crimeAlertTitle = this.navParams.get('crimeAlertTitle');
this.crimeAlertBody = this.navParams.get('crimeAlertBody');
this.newsItemsName = this.navParams.get('newsItemsName');
this.newsItemsBody = this.navParams.get('newsItemsBody');
this.newsItemsImaged = this.navParams.get('newsItemsImaged');
this.newsItemsImage = this.navParams.get('newsItemsImage');
this.eventItemsName = this.navParams.get('eventItemsName');
this.eventItemsBody = this.navParams.get('eventItemsBody');
this.eventItemsImaged = this.navParams.get('eventItemsImaged');
this.eventItemsImage = this.navParams.get('eventItemsImage');
this.newsEvents = [
{
pageTitle: 'Recent News',
name: this.city,
itemName: this.newsItemsName,
imaged: this.newsItemsImaged,
image: this.newsItemsImage,
body: this.newsItemsBody
},
{
pageTitle: 'New Events',
name: this.city,
itemName: this.eventItemsName,
imaged: this.eventItemsImaged,
image: this.eventItemsImage,
body: this.eventItemsBody
}
]
}
같은 배열이 더 있습니다. 내부 배열과 관련이없는 데이터를 가져옵니다. 그러나 "하위 배열"(예 : newsItems 및 eventItems)에서 데이터를 가져 오는 데 문제가 있습니다.
프로젝트의 아래쪽은 도시의 이름 만 블록으로 표시하는 홈 페이지입니다 (예 : 배열의 이름 부분). ->탭하면 해당 도시와 도시에 대한 정보가있는 하위 페이지로 이동합니다 (예 : shortName, 이벤트 수, 뉴스 수, 날씨, crimeAlert (<-n 인 경우 표시되지 않음) dom), crimeAlertTitle, crimeAlertBody). 해당 서브 페이지 하단에는 "Recent News"와 "New Events"의 두 가지 옵션이 있습니다. ->탭하면 도시 정보 하위 페이지의 하위 페이지로 이동하고 지정된 제목 (예 : 최근 뉴스 또는 새 이벤트)이 있고 그 아래에 도시 이름이 표시됩니다. 내 문제는이 페이지에서이 페이지에 뉴스 항목이나 이벤트 항목을 표시 할 수 없다는 것입니다. 특히 둘 이상이있을 수 있기 때문에 * ngFor가이 모두에 맞는 위치를 알 수 없습니다.
- 답변 # 1
관련 자료
- electron, javascript - 데이터베이스에서 반환 된 배열 내에서 배열을 선택하는 방법
- reactjs - 자바 스크립트를 사용하여 기존 배열로 데이터 푸시
- javascript - FOREACH를 사용하여 json 배열의 최소값을 어떻게 얻을 수 있습니까?
- javascript - Mongoose를 사용하여 특정 개체 배열을 찾고 그 안에있는 모든 개체 만 가져옵니다
- C #에서 중괄호없이 스위치 섹션 내에서 using 변수를 사용할 수없는 이유는 무엇입니까?
- java - REST Assured를 사용하여 HTTP PUT 호출에 JSON 배열을 넣는 방법은 무엇입니까?
- 자바 스크립트 - 문자열 내에서 json 객체의 배열 구문 분석
- javascript - Regex를 사용하여 필터링 된 배열 가져 오기
- numpy의`full ()`메서드와 파이썬 목록을 사용하여 numpy 배열을 만들 수 없습니다
- python - 각 항목에 여러 값이있는 배열 내의 항목 인쇄
- jq를 사용하여 JSON의 중첩 배열에서 선택하면 빈 결과가 제공됩니다
- JavaScript to HTML (JSON)을 사용하여 배열과 연결된 루프
- winscp get 명령을 사용하여 날짜 범위 내에서 파일을 다운로드하는 방법
- jQuery 또는 JavaScript를 사용하여 배열에서 데이터 추출
- node.js - 맵을 사용하여 중첩 된 배열에서 인쇄, 자바 스크립트에서 축소 및 필터링
- javascript - 로컬 스토리지의 어레이 내에 타임 스탬프를 배치하는 방법은 무엇입니까?
- javascript - 키/값이 유사한 배열의 객체를 해당 배열 내의 배열로 바꾸는 방법
- bash - 스크립트 내에서 실행되는 Docker와 함께 시간 초과 사용
- java - 디렉토리 내의 파일로 채워지지 않는 파일 배열, 이유를 알 수 없음
- c++ - 템플릿을 배열 차원으로 사용할 때 어떻게 작동합니까?
관련 질문
- Ionic/Angular/Firestore: 페이지 새로 고침 없이 필드 새로 고침 전략
- angular : IONIC에 MapsAPILoader 제공자가 없습니다.
- Ionic 6 Angular -Guard가 페이지를 리디렉션하지만 새로 고치지 않습니다.
- javascript : 각도 구성 요소가 업데이트되지 않고 값이 변경됨
- javascript : 성공적인 컴파일 후 페이지가 로드되지 않는 이유는 무엇입니까?
- javascript : 프로덕션 빌드의 유효성 검사 조건에서 오류를 표시하는 Angular Reactive 양식
- android : Ionic의 경고 확인 창에서 음성 확인
- node.js : Ionic -'ionic cordova 플랫폼 리소스 ios'가 있는 SubprocessError
- angular : ionic을 사용하여 ngModel 속성으로 요소를 동적으로 생성하는 방법은 무엇입니까?
- Ionic 2
내에서 스크롤바를 비활성화하거나 숨기려면 어떻게 해야 하나요?
객체 내의 배열 인 속성에 액세스하는 것이 * ngFor에서 잘 작동하지 않는다는 것을 발견했습니다.이 문제를 해결하기 위해 한 것은 .ts 파일에서 배열 ... 그래서 다음과 같이하는 대신 : .ts 파일 :
html :