Angular *如果表达式包含字符串,则ngIf不起作用

Angular *如果表达式包含字符串,则ngIf不起作用,angular,input,angular-ng-if,Angular,Input,Angular Ng If,我有一个todo组件,具有读取、编辑和插入模式。该模板如下所示: <form *ngIf="editMode=='edit' || editMode=='insert'" class="form" (ngSubmit)="onSubmit()" [formGroup]='todoForm' novalidate> .... edit and insert mode contents </form> <span style="line-height: 33px;

我有一个todo组件,具有读取、编辑和插入模式。该模板如下所示:

<form *ngIf="editMode=='edit' || editMode=='insert'" class="form" (ngSubmit)="onSubmit()" [formGroup]='todoForm' novalidate>
  .... edit and insert mode contents
</form>

<span style="line-height: 33px;" *ngIf="editMode=='read'">
  .... read mode contents

</span>
<div class="container">
  <div class='todos-container'>
    <ul class="list-group">

      <li *ngFor="let todo of todos" class="list-group-item clearfix">
        <todo-component [todo]='todo' [editMode]='read'></todo-component>
      </li>
      <li class="list-group-item clearfix">
        <todo-component [todo]='newTodo' [editMode]='insert'></todo-component>
      </li>
    </ul>
  </div>
</div>
我有一个列表组件,它有一个todo组件列表,如下所示:

<form *ngIf="editMode=='edit' || editMode=='insert'" class="form" (ngSubmit)="onSubmit()" [formGroup]='todoForm' novalidate>
  .... edit and insert mode contents
</form>

<span style="line-height: 33px;" *ngIf="editMode=='read'">
  .... read mode contents

</span>
<div class="container">
  <div class='todos-container'>
    <ul class="list-group">

      <li *ngFor="let todo of todos" class="list-group-item clearfix">
        <todo-component [todo]='todo' [editMode]='read'></todo-component>
      </li>
      <li class="list-group-item clearfix">
        <todo-component [todo]='newTodo' [editMode]='insert'></todo-component>
      </li>
    </ul>
  </div>
</div>

问题是形状和跨度都不可见。当editMode是一个简单的布尔值时,它就会正常工作<代码>*ngIf=“editMode”或
*ngIf=“!editMode”
有效。我做错了什么?

试试看

[editMode]="'read'"

比如说

<todo-component [todo]='todo' editMode="read"></todo-component>

然后
editMode
将是字符串
read

另见

试试看

比如说

<todo-component [todo]='todo' editMode="read"></todo-component>

然后
editMode
将是字符串
read

另见


Try===而不是==在您的条件中我尝试过,它不起作用editMode是一个输入属性,您需要提供引号,同时提供这样的值[editMode]=“'read'”而不带引号,它试图查找名为read from outer component的不存在的变量。Try==而不是==在您的条件中我尝试过,它不工作editMode是一个输入属性,您需要提供引号,同时提供这样的值[editMode]=“read”“”而不带引号。它试图查找名为read from outer component的变量,但该变量不存在。是的,这可以工作!谢谢,这两种解决方案都有效。现在,我认为我需要以某种方式将属性中的值转换为字符串似乎是合乎逻辑的。但是它看起来确实有点奇怪,特别是第一个语法看起来像是设计出来的:)第一个语法是一个模板表达式
[property]=“expression”
是的,这很有效!谢谢,这两种解决方案都有效。现在,我认为我需要以某种方式将属性中的值转换为字符串似乎是合乎逻辑的。但是它看起来确实有点奇怪,特别是第一个语法看起来像是设计出来的:)第一个语法是一个模板表达式
[property]=“expression”