时间戳

首页 > 解决方案 > 动态更改 TeplateUrl

angular - 动态更改 TeplateUrl

问题描述

我正在尝试templateUrl动态制作，但它似乎在 UI 中返回 URL 字符串。

这是我的代码

@Component({
  selector: 'app-login',
  templateUrl: '../login/'+Setting.URL+'/login.html',
  // templateUrl: '../login/web/login.html',
  styleUrls: ['./login.component.scss']
});

问题是，模板 url 不读取 html 文件位置。

标签： angularangularjs-directive

解决方案

动态 url 的正确方法是通过深度链接，始终使用相同的 html 模板但具有不同的信息。

在您的路由器中：

const routes: Routes = [
  {
    path: 'login/:name',
    component: LoginComponent,
  }
];
...
RouterModule.forRoot(routes, {useHash: true})

在您的组件中：

@Component({
  selector: 'app-login',
  templateUrl: '../login/web/login.html',
  styleUrls: ['./login.component.scss']
});

constructor(
  private route: ActivatedRoute,
) {
  this.route.params.subscribe((params) => {
    console.log(params.name);
  });
}

推荐阅读