角度灯箱:由于它不是"a"的已知属性,因此无法绑定到“数据灯箱" [英] Angular lightbox: Can't bind to 'data-lightbox' since it isn't a known property of 'a'
问题描述
我读了《 Angular》.它表示如果要绑定属性,则应使用[]进行包装.所以这就是我所做的,但是我遇到了错误.知道我在做什么错吗?
I read Angular. It says if you want to bind a property it should be wrapped with []. So here what I did, But I am getting error. Any idea what am I doing wrong?
我的要求是让data-lightbox的值是我正在设置/从另一个组件(父组件)发送的值
My requirement is to have the value of data-lightbox is what I am setting/sending from another component(parent component)
image-display.component.ts
image-display.component.ts
@Component({
selector: 'app-image-display',
templateUrl: './image-display.component.html',
styleUrls: ['./image.component.css']
})
export class ImageDisplayComponent implements OnInit {
@ViewChild('inspImage') image: ElementRef
@Input() inspection: LineSideInspection
inpsectionId: number;
santizer: DomSanitizer
constructor(private imageService: ImageDisplayService, private sanitizer: DomSanitizer) {}
ngOnInit() {
this.getMyImage('/getimage/' + this.inspection.id );
this.inpsectionId = this.inspection.id;
}
}
image-display.component.html
image-display.component.html
<a [href]="sanitize(inspImage.src)" [data-lightbox]="inspectionId" data-title="inspect.inspectionDescription">
<img #inspImage width="110px" height="95px">
</a>
package.json:
package.json:
"lightbox2": "^2.10.0",
推荐答案
我找到了一种在灯箱中显示标题的方法.这是我所做的:
I found a way of showing title in the lightbox. Here is what I did:
在component.ts中,我声明了一个字符串变量,并在init方法中分配了值,然后在html中,将该变量放在了方括号中.
In component.ts, I declared a string variable and assigned value in init method, then in html, I put that variable inside double brackets.
html:
<a [href]="sanitize(inspImage.src)" [data-lightbox]="inspectionId" data-title="{{inspectionName}}">
TS:
public inspectionName: string;
ngOnInit(){
this.inspectionName = this.inspection.inspectionName;
}
这篇关于角度灯箱:由于它不是"a"的已知属性,因此无法绑定到“数据灯箱"的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!