string interpolation angular code example

Example 1: condition in string interpolation angular

{{ Condition ? 'Text_For_True' : 'Text_For_False' }}

Example 2: angular property binding

// component.ts

    @Component({
      templateUrl: 'component.html',
      selector: 'app-component',
    })
    export class Component {
      name = 'Peter';

      updateName() {
        this.name = 'John';
      }
    }

Example 3: use javascript function in string interpolation angular

//angular HTML
{{secondsToHms(20)}}

//typescript
secondsToHms(d) {
    d = Number(d);
    var h = Math.floor(d / 3600);
    var m = Math.floor(d % 3600 / 60);
    var s = Math.floor(d % 3600 % 60);

    var hDisplay = h > 0 ? h + (h == 1 ? " hour, " : " hours, ") : "";
    var mDisplay = m > 0 ? m + (m == 1 ? " minute, " : " minutes, ") : "";
    var sDisplay = s > 0 ? s + (s == 1 ? " second" : " seconds") : "";
    return hDisplay + mDisplay + sDisplay; 
}

Example 4: ? operator in angular interpolations

{{element.source == 1 ? 'upwork' : (element.source == 2 ? 'refer from friend' : '')}}