AngularJS bootstrapUI：如何在modal中呈现动态页面？

我用模态函数来显示一个全尺寸的图像

            $scope.openModalPicture = function (id) {
                var modalInstance = $modal.open({
                    templateUrl: '../user/picture/'+id,
                    controller: ModalInstanceCtrl
                });
            };  

因此，如果我在我的浏览器中调用，它将呈现一些带有图片的html。问题是页面加载时角度加载。如果用户10的图片在页面加载后发生变化，并且我单击调用

openModalPicture

函数，我仍然会得到上一张图像

我发现

templateUrl

只是一个本地模板，所有内容都使用$scope变量。 唯一的解决方案似乎是通过

$http

请求检索我需要的数据并填充本地templateUrl，或者还有其他技巧吗

---

编辑：查看plunker，您可以将参数传递给您的模型。因此，如果您在主控制器中有正确的图片URL，只需在打开它时将其传递给modal即可

$scope.openModal = function () {
    var modalInstance = $modal.open({
        templateUrl: 'modal.html',
        controller: ModalInstanceCtrl,
        size:'sm',
        resolve: {
            picture: function() {
                //you can pass any other parameter instead of hard-coded string of course
                return "http://freedogpics.com/wp-content/uploads/2014/08/pictures_1407299643.jpg";
            }
        }
    });
};

var ModalInstanceCtrl = function ($scope, $modalInstance, picture) {
    $scope.cancel = function () {
        $modalInstance.dismiss('cancel');
    };
    $scope.picture = picture;
};

以及模板：

<table cellpadding="0" cellspacing="0" border="0">
  <tr>
    <td valign="top"><span ng-click="cancel()">Close</span></td>
    <td><img ng-src="{{picture}}" border="0"/></td>
  </tr>
</table>

接近

---

我已使用修改了您的plunkr。

请显示您的html并设置演示。你想要实现的是直截了当的。如果你安装了plunkr或JSFIDLE，我会告诉你怎么做，只是解释一下方法，我不需要代码，只要阅读文档就可以了。您可以自定义template@apairet我为youThanks做了一个猛击。我会看一看的。谢谢你的回答。这里的问题是，如果我决定在动态页面中添加一些特性，如注释，那么我必须使用您的解决方案将它们也传递到模式中，对吗？我认为最好的解决方案是在模式模板中使用iframe，并将动态页面作为源代码no？@yarons答案很好。我不认为使用iframe有什么意义。