Angular 用于遗留旧值的动态NGF
我试图在Angular 5中实现一些收藏夹系统，但每次我从列表中添加或删除收藏夹时，显示的列表也会保留旧列表。也就是说，如果我从收藏夹列表[a，b，c]开始并添加一个新的d，那么我将以列表[a，b，c，d，a，b，c]结束。例如，这里只有一个收藏夹： 在这里，我尝试添加一个新的： 效果是：如果我添加了n个新收藏夹，我将得到n份列表副本。这纯粹是一种动态效果，就像我只是刷新页面一样，列表正常显示。问题似乎也不是来自favorites数组，因为它似乎从来没有重复的条目 所涉及的基本代码是在Smart中使用的侧边栏，为收藏列表的目的而修改。涉及的组件为AppSidebarNavComponent：Angular 用于遗留旧值的动态NGF,angular,Angular,我试图在Angular 5中实现一些收藏夹系统，但每次我从列表中添加或删除收藏夹时，显示的列表也会保留旧列表。也就是说，如果我从收藏夹列表[a，b，c]开始并添加一个新的d，那么我将以列表[a，b，c，d，a，b，c]结束。例如，这里只有一个收藏夹： 在这里，我尝试添加一个新的： 效果是：如果我添加了n个新收藏夹，我将得到n份列表副本。这纯粹是一种动态效果，就像我只是刷新页面一样，列表正常显示。问题似乎也不是来自favorites数组，因为它似乎从来没有重复的条目 所涉及的基本代码是在Sma
export class AppSidebarNavComponent implements OnInit, AfterViewInit
{
ngAfterViewInit()
{
if(this.projectService.fav === null)
{
let usersub = this.userService.userObs.subscribe(user =>
{
let favs = [];
this.projectService.loadFavorites(user.id);
let favsub = this.projectService.favorites.subscribe(data =>
{
let favs = [];
for(let fav of data)
{
let name = fav.Program;
let url = '/geometry/' + fav.projectid;
let child = {name: name, url: url, icon: 'icon-star', fav: true};
favs.push(child);
}
if(this.navigation[1].hasOwnProperty("children"))
{
this.navigation[1]["children"] = favs;
}
});
});
}
}
}
@Component({
selector: 'app-sidebar-nav-item',
template: `
<li>
<app-sidebar-nav-link [link]='item'></app-sidebar-nav-link>
</li>
<ng-template #dropdown>
<li>
<app-sidebar-nav-dropdown [link]='item'></app-sidebar-nav-dropdown>
</li>
</ng-template>
`
})
export class AppSidebarNavComponent implements OnInit, AfterViewInit
{
ngAfterViewInit()
{
if(this.projectService.fav === null)
{
let usersub = this.userService.userObs.subscribe(user =>
{
let favs = [];
this.projectService.loadFavorites(user.id);
let favsub = this.projectService.favorites.subscribe(data =>
{
let favs = [];
for(let fav of data)
{
let name = fav.Program;
let url = '/geometry/' + fav.projectid;
let child = {name: name, url: url, icon: 'icon-star', fav: true};
favs.push(child);
}
if(this.navigation[1].hasOwnProperty("children"))
{
this.navigation[1]["children"] = favs;
}
});
});
}
}
}
@Component({
selector: 'app-sidebar-nav-item',
template: `
<li>
<app-sidebar-nav-link [link]='item'></app-sidebar-nav-link>
</li>
<ng-template #dropdown>
<li>
<app-sidebar-nav-dropdown [link]='item'></app-sidebar-nav-dropdown>
</li>
</ng-template>
`
})
@组件({
选择器：“应用程序侧栏导航项”，
模板：`
`
})
导出类AppSidebarNavLinkComponent{
公共删除FAV（链接）
{
this.projectService.removeFavorite（this.userService.user.id，link.name）。订阅（数据=>
{
this.projectService.loadFavorites（this.userService.user.id，true）；
});
}
}
@Component({
template: `
<a>
{{ link.name }}
</a>
<ul>
<app-sidebar-nav-item *ngFor="let child of link.children"
[item]='child'></app-sidebar-nav-item>
</ul>
`
})
@组件({
模板：`
{{link.name}
`
})
我尝试在加载收藏夹后完成订阅，但这只会使列表不再更新。我试图手动删除列表中的条目，但Angular似乎不喜欢它，当它试图插入收藏夹时，它崩溃了。没有其他与*ngFor相关的组件显示这种行为，我不确定是什么导致了这种情况。未来的访客您好。如果您在这个问题上也有问题，那么解决方案似乎是，显然，使用动态组件而不是直接使用HTML代码似乎是一个问题。替换
<app-sidebar-nav-item *ngFor="let child of link.children"
[item]='child'></app-sidebar-nav-item>
...
div包含应用程序侧栏导航项的适当内容的地方似乎起到了作用。来自未来的访客您好。如果您在这个问题上也有问题，那么解决方案似乎是，显然，使用动态组件而不是直接使用HTML代码似乎是一个问题。替换
<app-sidebar-nav-item *ngFor="let child of link.children"
[item]='child'></app-sidebar-nav-item>
...
div中包含应用程序侧栏导航项的适当内容似乎起到了作用。我参与了这个线程，因为我刚刚遇到了类似的问题，所以我想至少在使用Clarity Design系统时，有人可以从中受益 我正在使用显示搜索结果。虽然每次搜索后结果数组都会正确更新，但结果会在视图中不断累积，使用*ngFor或Clarity自定义指令*CLRDGEMS 我不知道问题的根源是什么，但通过更新项目的依赖关系成功地解决了问题；特别是：
Name Version Command to update
--------------------------------------------------------------------
@angular/cli 9.0.3 -> 9.0.4 ng update @angular/cli
@angular/core 9.0.2 -> 9.0.4 ng update @angular/core
@clr/angular 2.3.8 -> 3.0.0 ng update @clr/angular
我对这篇文章的贡献是因为我刚刚遇到了一个类似的问题，所以我想有人可以从中受益，至少如果使用Clarity设计系统的话 我正在使用显示搜索结果。虽然每次搜索后结果数组都会正确更新，但结果会在视图中不断累积，使用*ngFor或Clarity自定义指令*CLRDGEMS 我不知道问题的根源是什么，但通过更新项目的依赖关系成功地解决了问题；特别是：
Name Version Command to update
--------------------------------------------------------------------
@angular/cli 9.0.3 -> 9.0.4 ng update @angular/cli
@angular/core 9.0.2 -> 9.0.4 ng update @angular/core
@clr/angular 2.3.8 -> 3.0.0 ng update @clr/angular
请提供最少的代码来重现/识别您的问题，而不是您的整个代码，因为阅读起来非常乏味。现在，它应该更可读一些，希望仍然能够识别问题。我看到了删除fav函数，但我没有看到添加fav函数，这正常吗？Stackblitz plz-TDLR；添加收藏夹功能是另一个组件使用的服务的一部分。我应该添加它吗？请提供最少的代码来重现/识别您的问题，而不是您的整个代码，因为阅读起来非常乏味。现在，它应该更可读一点，希望仍然能够识别问题。我看到了删除fav函数，但我没有看到添加fav函数，这正常吗？Stackblitz plz-TDLR；添加收藏夹功能是另一个组件使用的服务的一部分。我应该加上它吗？我只是在一点尝试和错误之后发现了相同的问题和解决方案。然后我找到了你的答案。我也在用angular 5。由于子模板
app侧边栏导航项app侧边栏导航项