(对不起我的英语,这不是我的第一语言......)
当我使用其模板调用它时,我在组件中注入(inject)的一些输入参数存在一些问题。
slider-multiple.component.ts :
import { Component, Input } from '@angular/core';
@Component({
selector: 'slider-multiple',
templateUrl: './slider-multiple.component.html'
})
export class SliderMultipleComponent {
@Input() public modifiable: boolean;
}
slider-multiple.component.html :
<button *ngIf="modifiable">Slider Button</button>
指令的调用(例如在 app.component.html 上):
<slider-multiple modifiable="activation"></slider-multiple>
在 app.component.ts 上定义激活:
export class AppComponent {
public activation : boolean = false ;
public activate(){
this.activation = !this.activation;
}
}
只有当指令的激活参数为 true 时,我在组件的 html 模板上定义的按钮才应该可见(通过 *ngIf)。
有谁知道为什么它不能按预期工作?
A Stackblitz帮助。
提前致谢!
最佳答案
更改 <slider-multiple modifiable="activation"></slider-multiple>
收件人<slider-multiple [modifiable]="activation"></slider-multiple>
modifiable="activation"
绑定(bind)到值为 activation
的字符串.
[modifiable]="activation"
绑定(bind)到名称为 activation
的组件属性.
关于javascript - Angular :@input boolean 和 ngIf 不匹配,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49799884/