How to set <iframe src=“…”> without causing `unsafe value` exception?

I am trying to set an iframe src attribute for youtube video in angular:

 <div class="embed-responsive embed-responsive-16by9">
 <iframe class="embed-responsive-item" [src]="" allowfullscreen></iframe>

I get the following error:

core.js:4442 ERROR Error: unsafe value used in a resource URL context

Please provide me a clear explanation of how to resolve this.

Source: Angular Questions