我有两个不同的指令。第一个返回带有实时视频的 iframe,第二个返回带有最近视频的 iframe。
条件是:如果存在实时内容,则附加实时指令,否则附加最近的视频指令。
我尝试过使用普通 html 而不是指令,它可以工作,但是当我放置指令元素时,不幸的是它不起作用。
WORKING
控制器.js
function isLiveOn() {
var liveIframe = '<h2>LIVE</h2>';
var videoIframe = '<h2>VIDEO</h2>';
if (vm.live.items[0] != undefined) {
$('.iframe-container').append(liveIframe);
} else {
$('.iframe-container').append(videoIframe);
}
};
不工作
控制器.js
function isLiveOn() {
var liveIframe = '<live-iframe live="vm.live.items[0]"></live-iframe>';
var videoIframe = '<last-video video="vm.activity.items[0]"></last-video>';
if (vm.live.items[0] != undefined) {
$('.iframe-container').append(liveIframe);
} else {
$('.iframe-container').append(videoIframe);
}
};
每个指令都有自己的 html 和 js 文件。
像这样的东西:
指令.html
<div class="live">
<iframe ng-src="{{getIframeSrc(live.id.videoId)}}"></iframe>
</div>
<div class="live-description">
<h4>{{live.snippet.title}}</h4>
</div>
指令.js
app.directive('live', live);
live.$inject = ['$window'];
function live($window) {
var directive = {
link: link,
restrict: 'EA',
templateUrl: 'path',
scope: {
live: '='
}
};
return directive;
function link(scope, element, attrs) {
scope.getIframeSrc = function(id) {
return 'https://www.youtube.com/embed/' + id;
};
}
}
所以我认为我可能缺少的指令存在一些问题。
任何帮助将不胜感激!