我有一个组件,它有一个输入参数:

import {Component,Input} from '@angular/core';

@Component({
    selector: 'comment' ,
    template: `    
        <div class="col-lg-6 col-md-6 col-xs-6 thumb">
            <div class="post-owner">
                <div class="media">
                    <div class="media-left">
                        <a href="#">
                          <img class="media-object rounder" src=imageURI >
                        </a>
                    </div>
                </div>
            </div>
        </div>`
})

export class CommentCompoent{
    @Input() imageURI="";
}

在父组件中,我向它传递了一个图像路径,如下所示:

<comment [imageURI]='image_path'></comment>

问题是,当我运行它时,它会抱怨:

EXCEPTION: Error: Uncaught (in promise): Quotes are not supported for evaluation!

那我该怎么办?

Update:当我移除父组件中的[imageURI]='image_path'时,它工作正常,并且它完美地显示了组件的其余部分

推荐答案

您应该将父组件中的comment标记更改为:

<comment [imageURI]="image_path"></comment>

分配模板绑定时不要使用单引号.仅用于格式化字符串,如下所示:

<comment [imageURI]="'path/to/image.jpg'"></comment>

Typescript相关问答推荐

如何从TypScript中的接口中正确获取特定键类型的所有属性?

TypScript手册中的never[]参数类型是什么意思?

在TypeScript中使用泛型的灵活返回值类型

为什么typescript不能推断类的方法返回类型为泛型''

如何将联合文字类型限制为文字类型之一

根据另一个属性的值来推断属性的类型

在TypeScrip中分配回调时,参数的分配方向与回调本身相反.为什么会这样呢?

状态更新后未触发特定元素的Reaction CSS转换

编剧错误:正在等待Expect(Locator).toBeVisible()

有条件地删除区分的联合类型中的属性的可选属性

对象类型的TypeScrip隐式索引签名

错误:NG02200:找不到类型为';对象';的其他支持对象';[对象对象]';.例如数组

如何在Reaction Native中关注屏幕时正确更新状态变量?

在TS泛型和记录类型映射方面有问题

如何使对象同时具有隐式和显式类型

类型分布在第一个泛型上,但不分布在第二个泛型上

是否使用类型将方法动态添加到类?

从泛型对象数组构造映射类型

Angular 16:无法覆盖;baseUrl;在tsconfig.app.json中

如何在 TypeScript 类型定义中简化定义长联合类型