您好我正在尝试使用角度6构建项目,并且我正在获取类别的输入:Tag []从超级棒组件到catbar组件。从catbar开始,我试图将类别[0] .category和categories [0] .superCategory的字符串传递给feed组件。 这是我遇到错误的地方,说它无法读取未定义的属性类别。我无法理解输入装饰器中的这个错误我明确地将其声明为@Input catgories:Tag []
PFA标记类的代码,catbar.html,catbar.ts和feed.ts :: Catbar - >
export class CatbarComponent implements OnInit {
private Catdomain = domain;
@Input() categories: Tag[];
//This input might have unfortunate timing
constructor() { }
ngOnInit() {
}
notifyme() {
console.log('AM here');
}
}
catbar.html
<div style = "text-align: center">
<nav _ngcontent-c4="" class="navbar-category" style="height: auto">
<ul>
<li *ngFor="let cat of categories" class="li-cat font-preadr cursor-pointer" >
<div class="li-cat-circle">
<img [ngClass]="{'li-cat-circle-img': !selectedCat || selectedCat.name !== cat.name, 'selected-cat-img': selectedCat && selectedCat.name === cat.name}"
[src] = "Catdomain + cat.image" [title]="cat.displayName">
</div>
<div class="li-cat-name" [title]="cat.displayName" [ngClass]="{'selected-cat-name': selectedCat && selectedCat.name === cat.name}">
{{cat.displayName}}
</div>
</li>
</ul>
</nav>
</div>
<app-feed [sucat]="categories[0].superCategory" [cat]="categories[0].category"></app-feed>
feed.ts - &GT;
@Input() cat :string;
@Input() sucat:string;
private cards : Card[];
private itemcount : number;
private lastpage : number;
constructor(private contentservice: ContentService) { }
private page :number = 1;
ngOnInit() {
this.fetchdata(this.sucat,this.cat);//initial fetch of data would require 3 default parameters
}
fetchdata(su :string,cat : string){
this.contentservice.getcontentdata(su,cat,this.page)
.subscribe((response) => {
const data = new JsonData(response);
this.cards = data.items;
this.cards.forEach(el =>{
console.log(el.title);
})
this.page++;
});
}
}
标记类 - &gt;
export class Tag {
public category: string;
public description: string;
public displayName: string;
public id?: number;
public name?: string;
public image?: string;
public isLive?: boolean;
public isLiveClient?: boolean;
public level?: number;
public shortDisplayName?: string;
public superCategory?: string;
}
catgories数组从superbar中填充为
@Component({
selector: 'app-superbar',
templateUrl: './superbar.component.html',
styleUrls: ['./superbar.component.css']
})
export class SuperbarComponent implements OnInit {
@ViewChild('child')
private child : CatbarComponent
supercategories : Tag [] = [];
allcategories : Tag[] = [];
categories : Tag[] = [];
tempCategories : Tag[] = [];
selectedsu : Tag;
constructor(private meta : MetadataService) {}
//using meta data service to get supercategories
ngOnInit() {
this.meta.getmetadata().subscribe(response =>{
//newCatJson requires an object type data
//in earlier versions one needed to body.parse(), but since http returns an object
//that no longer needs be done
const data = new CatJson(response);
this.supercategories = data.superCat;
this.selectedsu = this.supercategories[0];
this.allcategories = data.allCat;
this.allcategories.forEach(item => {
if (this.supercategories[0].superCategory == item.superCategory)
this.categories.push(item);
})
});
}
并输入catbar
<app-catbar #child [categories]="categories"></app-catbar>
答案 0 :(得分:0)
使用ng-container&amp; <ng-container *ngIf="categories[0]">
<app-feed [sucat]="categories[0].superCategory" [cat]="categories[0].category"></app-feed>
</ng-container>
适用于这种情况:
SELECT min(name) name,
code,
sum(quantity) quantity,
min(storename) storename
FROM elbat
GROUP BY code;