функция ngSrc называется бесконечно в angular2

Для того, чтобы загрузить фильм юность в IFRAME, я следующий в моем шаблоне:функция ngSrc называется бесконечно в angular2

<iframe [src]="getYouTubeUrl(currentItem.id)" frameborder="0" allowfullscreen></iframe>

В компоненте я определил:

getYouTubeUrl(id:string):SafeResourceUrl { 
    let url:string = `https://www.youtube.com/embed/${id}`; 
    return this.sanitizer.bypassSecurityTrustResourceUrl(url); 
}

Как-то , эта функция называется бесконечно (в то время как полученный URL не изменяется). В результате видео нельзя загрузить. Что здесь может быть не так?

источник

2016-10-03 dndr

Использование чистой трубы вместо. См. Также http://stackoverflow.com/questions/38037760/how-to-set-iframe-src-in-angular-2-without-causing-unsafe-value-exception/38037914#38037914 и выпустить на github https://github.com/angular/angular/issues/11518 – yurzui

Спасибо, это работает! :) Я не знаю, почему изменение обнаружения выполняется несколько раз без трубы, но только один раз с трубой? Может быть, потому, что теперь функция возвращает строку (url), которая является примитивной, а не SafeResourceUrl, которая не является примитивной? – dndr

Чистая труба будет выполнена только тогда, когда она обнаружит чистое изменение входного значения. С другой стороны, ваша функция внутри шаблона будет вызывать каждый «Application.tick» http://stackoverflow.com/questions/39757603/unraveling-angular-2-book-chapter-1-example-5/39761822#39761822 – yurzui

Обнаружение изменений углов вызывает метод каждый раз, когда выполняется обнаружение изменений, что обычно происходит довольно часто. Именно по этой причине не рекомендуется связывать функции или методы.

Вместо этого присвойте результат функции или метода свойству и привяжите его к этому свойству из представления.

<iframe [src]="youTubeUrl" frameborder="0" allowfullscreen></iframe>

ngOnInit() { 
    this.youTubeUrl = getYouTubeUrl(this.currentItem.id); 
}

источник

2016-10-03 14:21:02

Что делать, если Я использую ретранслятор (ngFor) в списке изображений с функцией для [src]? – alex351

То же самое. Не связывайте функции. Подготовьте новый массив, содержащий результат для каждого элемента (или добавьте данные в «список изображений»), а затем привяжите к этому массиву. –

Хороший звонок, спасибо. – alex351

функция ngSrc называется бесконечно в angular2

ответ

Смежные вопросы