小编bas*_*eux的帖子

角度:@input boolean 和 ngIf 不匹配

(抱歉我的英语,这不是我的母语...)

当我用它的模板调用它时,我在我的组件中注入的一些输入参数有一些问题。

滑块-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;
 }
Run Code Online (Sandbox Code Playgroud)

滑块-multiple.component.html :

<button *ngIf="modifiable">Slider Button</button>
Run Code Online (Sandbox Code Playgroud)

指令的调用(例如在 app.component.html 上):

<slider-multiple modifiable="activation"></slider-multiple>
Run Code Online (Sandbox Code Playgroud)

随着激活的app.component.ts定义:

export class AppComponent  {
   public activation : boolean = false ;

   public activate(){
     this.activation = !this.activation;
   }
 }
Run Code Online (Sandbox Code Playgroud)

只有当指令的激活参数为 true 时,我在组件的 html 模板上定义的按钮才应该可见(通过 *ngIf)。

有谁知道为什么它不能按预期工作?

一个Stackblitz来帮助。

提前致谢 !

javascript input typescript angular

3
推荐指数
1
解决办法
2088
查看次数

标签 统计

angular ×1

input ×1

javascript ×1

typescript ×1