首页 > 解决方案 > 单击后将 html 或模板加载到 div 中

问题描述

我是 Angular 的新手,我有一个问题:我有一个 div ......如果我们点击 div ..一个函数将被触发..这个函数将在验证输入数据后将模板加载到 div 中将其与默认数据进行比较。所以我的意思是

<div (click)="openTile(data.Salutation === Title.Sir) ? 'Tasks-details' : 'Todo-details';" >

其中 Salutation 是“数据”的参数(构造函数的距离),Title 是枚举类(在我们的组件中导入)

任何人都可以通过函数 openTile 帮助我吗?

多谢

标签: javascripthtmlangular

解决方案


我不确定我是否理解正确。如果只是想在点击后根据某些条件显示不同的内容,您可以这样做:

    @Component({
        template: `
    <div (click)="onClick(data.Salutation, Title.Sir)>
        <ng-container [ngTemplateOutlet]="isEqual ? task : todo"></ng-container>
    </div>
    <ng-template #task> if true </ng-template>
    <ng-template #todo> if false </ng-template>
`
    })
    class MyComponent {
        isEqual: boolean;
        onClick(salutation, sir) {
            this.isEqual = salutation === sir;
        }
    }

推荐阅读