0

我正在尝试传递一个字典（通道），其中包括名称的键/值对、topChannelUserNames 和 topChannelIds，其中最后两个是字符串数组。我看到传递给 var 流的正确值，但它没有反映在作为弹出框内容的通道变量中。如何正确地将流传递到 channelinfo 指令？

仅供参考，通道是从服务器调用异步填充在范围内的，因此在评估指令时它不可用，因此是 scope.$watch 调用。

此外，templateUrl 似乎不起作用，所以我将整个 HTML 模板包含在 channelinfo 指令中。

HTML 代码：

<li><a popover="" rel="popover" data-placement="right" data-trigger="hover" stream="channels.comedy_talkshow" href="#/channel/comedy_talkshow">Talk Show</a></li>

Javascript代码：

blissApp.directive('popover', function($compile) {
return {
    restrict: 'A',
    scope: {
        stream: "="
    },
    link: function(scope, element, attrs)
    {
        var stream;

        scope.$watch('stream', function(newValue, oldValue) {
            stream = newValue;
            console.log('attribute = ' + stream);

        var ele = angular.element("<channelinfo data='stream'></channelinfo>");            
        var channel = $compile(ele)(scope);           
        console.log('content = ' + channel);
        $(element).popover({position: 'right', trigger: 'hover', placement: "right", content: channel});
        }, true);
    }
}
});

blissApp.directive('channelinfo' , function() {
return {
    restrict: 'E',
    scope: {data: "="},
    template: '<div style="padding:0px"> <div><span ng-repeat="thumbUrl in data.topChannelIds"> <img style="width:70px; height:70px; float:left;" src="https://i.ytimg.com/i/{{thumbUrl}}/mq1.jpg"/></span> <p style="color:#333; float:left">Including channels: <span ng-repeat="name in data.topChannelUserNames"> {{name}}<span ng-show=" ! $last ">, </span></span></p></div></div>'
    //templateUrl: 'template/popover/popover.html'
}
});
4

0 回答 0