我正在尝试制作一个router-outlet内部作品，DashboardComponent该作品本身可以通过中router-outler存在来提供app.component.html。
我试图实现的流程如下所示：
用户登录后，将用户重定向到/dashboardload DashboardComponent。
DashboardComponent包含mat-sidenav-container有mat-sidenav链接和一个div容器，里面我有服务于不同的组件- ，，AComponent 根据链接点击了。BComponentCComponentmat-sidenav
也就是说，路径localhost:4200/dashboard/componentA应显示AComponent在DashboardComponent的div容器中，依此类推。
/dashboard应重定向到/dashboard/componentA我很难弄清楚如何显示DashboardComponentusing中的组件router-outlet。
这可能吗？有什么更好的方法吗？
工作代码：https : //stackblitz.com/edit/angular-qvacwn/
应用程序路由
import { Routes, RouterModule } from '@angular/router';
import { HomeComponent } from './home/home.component';
import { DashboardComponent } from './dashboard/dashboard.component';
import { AComponent } from './a/a.component';
import { BComponent } …我正在尝试重新创建纽约时报时装周页面中使用的笛卡尔扭曲效果.但是,他们使用D3版本3和D3js的fisheye插件,它不适用于D3版本4.
由于我们所做的整个项目都在D3 V4中,所以我无法降级到D3版本3.
是否有其他方法可以使用CSS和jquery实现此效果？
我试过这是我到目前为止的地方:预览
window.onload = run;
function run() {
if ($('.overlayDiv').css('display') != 'none') {
var container = d3.select('.overlayDiv');
container.empty();
var val = parseInt(5);
var overlayWidth = $(".overlayDiv").width();
var vwidth = (overlayWidth / (val));
console.log(vwidth);
for (i = 0; i < val; ++i) {
var div = container.append("div").style("width", vwidth + "px")
.style("height", "100%")
.style("background", "rgb(75, 123, 175)")
.style("float", "left")
var year = div.text(i)
.attr("class", "summary")
.style("text-align", "center")
.style("font-size", "32px")
.style("font-weight", "bold")
.style("line-height", "100px").style("color", "white")
.on('mouseover', function() …我正在使用GlobalDataService（从此处引用）将响应API的登录数据存储在全局变量中，以用于其他一些API调用。
登录（）：
if (_token) {
// store username and jwt token in keep user logged in between page refreshes
console.log(this.gd.currentUserData)
this.gd.currentUserData['userID']=_id;
this.gd.currentUserData['username']=username;
this.gd.currentUserData['token']=_token;
// return true to indicate successful login
return true;
}
然后在内部xx.service.ts文件中，我正在访问此全局变量，如下所示，该变量constructor()然后由各种函数使用以进行API调用。
constructor(private http: Http, private gd: GlobalDataService) {
let currentUser = this.gd.currentUserData;
this.token = currentUser && currentUser.token;
this.userID=currentUser.userID;
}
问题
我注销（在此期间清除了全局变量中的数据）然后使用另一个用户帐户登录后，其中的功能service.ts仍在使用存储在那些全局变量中的先前数据。
内部logout（）：
this.gd.currentUserData={};
this.gd.currentHospitalData={};
我认为问题是构造函数仅实例化一次，因此分配给全局变量的新数据不会反映在.service.ts文件中。
如何解决此问题？还是有更好的方法来处理这种情况？
注意：以前我曾经localstorage存储过这些数据，但是由于可以通过Chrome Dev Tools进行修改，因此我现在考虑使用全局变量。
更新资料
我知道这是很棘手的方法，不是正确的方法，但是我注意到调用window.location.reload();logout（）可以解决问题。 …