Angular @Input Formatting

Question

I have in one component the following...

...
<file-downloader [link]="result.downloadLink" [tooltip]="Download file from result.teamName"></file-downloader>
...

with the file-downloader component looking like... (more code but stripped down)

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

@Component({
  selector: 'file-downloader',
  templateUrl: './downloader.component.html',
  styleUrls: ['./downloader.component.css']
})
export class DownloaderComponent implements OnInit {

  @Input() link: string;
  @Input() tooltip: string;

}

Issue is that I need a formmated version that will take an argument: [tooltip]="Download file from result.teamName"

so result.teamName is coming in as a collection...

<li *ngFor="let result of results">
   <file-downloader [link]="result.downloadLink" [tooltip]="Download file from result.teamName"></file-downloader>
   {{result.teamName}}
</li>

As it stands I do not know the syntax to pass a string with formatted args into and @Input of the tooltip property of the component. It simply shows a syntax error when ever I try this with various positions of quotes.

using Angular2 not Angular1

developer033 · Accepted Answer · 2017-05-11 02:19:00Z

2

You can use it:

[tooltip]="'Download file from ' + result.teamName"

answered May 11, 2017 at 2:19

developer033

25k8 gold badges85 silver badges113 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular @Input Formatting

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related