Как реализовать ленивую загрузку в Angular с динамическим img src

Question

Мне нужна ваша помощь, чтобы понять это: я загружаю несколько изображений в мое приложение с динамическим src, поэтому я не могу предопределить их источник, поскольку он зависит от определенных параметров , например:

<img src="assets/images/{{tile.name | sanitiseString}}.jpg"> 

Я пробовал много ленивых плагинов загрузки, но они не работают в этой ситуации.

Как я могу это решить?

спасибо, что заранее.

Answer 1

Я думаю, что вам нужно, это нг-Src

Это пример

<img ng-src="http://www.gravatar.com/avatar/{{hash}}" alt="Description" /> 

И это официальная документация AngularJs

Answer 2

Я думаю, что ваш код должен работать нормально. Просто попробуйте с tile.name и удалите фильтр для начала. Вот пример предполагая, что «мозаичный» переменный заселяются из HTTP вызова

<img src="{{imgPath}}"> 

$http.get('https://jsonplaceholder.typicode.com/photos/1') 
    .then(function(response){ 

    $scope.imgPath = response.data.url; 
    }) 

Angularjs продолжает повторно запустить цикл дайджеста, чтобы гарантировать, что вся интерполяция (в пределах углового) присваивается значение.