У меня есть компонент с контроллером и шаблоном.Свойства из контроллера заменяются в шаблоне, когда они находятся между тегами html, но не как атрибуты тега.
Итак, учитывая этот компонент:
angular.module('OeApp').component('phonemeComponent', {
templateUrl: '/src/templates/phoneme.template.html',
controller: 'PhonemeController as ctrl',
bindings: {
exercise: '<'
}
})
Контроллер:
angular.module('OeApp').controller('PhonemeController', PhonemeController);
function PhonemeController() {
var ctrl = this;
ctrl.listenButtonUrl = "/images/speaker-button-sm.gif";
};
Фрагмент шаблона:
<div id="phoneticSymbol">{{ctrl.exercise.phoneticSymbol}}</div>
<!-- sample word -->
<img class="listenButton" src="ctrl.listenButtonUrl"></img>
<div id="oeWord">{{ctrl.exercise.sampleWordOE}}</div>
<div id="modWord">({{ctrl.exercise.sampleWordModE}})</div>
phoneticSymbol, oeWord и modWord все заменены, как и ожидалось, но src для img - это буквальная строка "ctrl.listenButtonUrl".Что мне не хватает?
Я попытался заключить ctrl.listenButtonUrl в фигурные скобки, хотя это не так, как это работает в другом примере кода, и браузер сначала пытается разрешить буквенную строку как URL (в результате получается 404 ), но в итоге получает правильное значение, поэтому я не думаю, что это правильное решение.