Questions tagged «angular-template»

16
如何使用* ng
我正在使用Angular,并且想*ngIf else在此示例中使用(自版本4起可用): <div *ngIf="isValid"> content here ... </div> <div *ngIf="!isValid"> other content here... </div> 如何实现相同的行为ngIf else?


18
Angular:带* ngClass的条件类
我的Angular代码有什么问题?我正进入(状态: Cannot read property 'remove' of undefined at BrowserDomAdapter.removeClass ... 的HTML <ol class="breadcrumb"> <li *ngClass="{active: step==='step1'}" (click)="step='step1; '">Step1</li> <li *ngClass="{active: step==='step2'}" (click)="step='step2'">Step2</li> <li *ngClass="{active: step==='step3'}" (click)="step='step3'">Step3</li> </ol>

3
带有用户单击所选组件的动态选项卡
我正在尝试设置一个选项卡系统,允许组件注册自己(带有标题)。第一个选项卡就像一个收件箱,有很多操作/链接项可供用户选择,并且这些单击中的每一个都应能够在单击时实例化一个新组件。操作/链接来自JSON。 然后,实例化的组件将自己注册为新选项卡。 我不确定这是否是“最佳”方法?到目前为止,我所见的唯一指南仅针对静态标签,这无济于事。 到目前为止,我只获得了tabs服务,该服务已在main中引导,可以在整个应用程序中持久保存。看起来像这样: export interface ITab { title: string; } @Injectable() export class TabsService { private tabs = new Set<ITab>(); addTab(title: string): ITab { let tab: ITab = { title }; this.tabs.add(tab); return tab; } removeTab(tab: ITab) { this.tabs.delete(tab); } } 问题: 我如何在收件箱中有一个动态列表来创建新的(不同的)标签?我有点猜测DynamicComponentBuilder会用到吗? 如何通过收件箱(单击)创建组件,将其自身注册为选项卡并显示出来?我在猜测ng-content,但找不到有关如何使用它的太多信息 编辑:试图澄清。 将收件箱视为邮件收件箱。项目以JSON格式获取,并显示多个项目。单击其中一项后,将创建一个带有该项操作“类型”的新标签。然后,该类型就是一个组件。 编辑2: 图片。

4
ngFor内部的动态模板参考变量(Angular 9)
如何在元素内声明动态 模板引用变量ngFor? 我想使用ng-bootstrap中的popover组件,弹出代码(带有HTML绑定)如下所示: <ng-template #popContent>Hello, <b>{{name}}</b>!</ng-template> <button type="button" class="btn btn-secondary" [ngbPopover]="popContent" popoverTitle="Fancy content"> I've got markup and bindings in my popover! </button> 如何将这些元素包装在里面ngFor? <div *ngFor="let member of members"> <!-- how to declare the '????' --> <ng-template #????>Hello, <b>{{member.name}}</b>!</ng-template> <button type="button" class="btn btn-secondary" [ngbPopover]="????" popoverTitle="Fancy content"> I've got markup and bindings …



4
在angular 4中为不同页面设置不同布局的最佳方法
我刚接触angular4。我想要实现的是为应用程序中的不同页面设置不同的布局页眉和页脚。我有三种不同的情况: 登录,注册页面(无页眉,无页脚) 路线:['登录','注册'] 营销站点页面(这是根路径,并且具有页眉和页脚,大多数这些部分在登录之前出现) 路线:['','关于','联系'] 应用程序登录页面(本节中所有应用程序页面的页眉和页脚都有不同,但是此页眉和页脚与营销网站的页眉和页脚不同) 路线:['dashboard','profile'] 我通过在路由器组件html中添加页眉和页脚来临时运行该应用程序。 请告诉我一个更好的方法。 这是我的代码: app \ app.routing.ts const appRoutes: Routes = [ { path: '', component: HomeComponent}, { path: 'about', component: AboutComponent}, { path: 'contact', component: ContactComponent}, { path: 'login', component: LoginComponent }, { path: 'register', component: RegisterComponent }, { path: 'dashboard', component: DashboardComponent …
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.