0

我确实有一系列不同的媒体资源：

  • 图片
  • 优酷网址
  • 简单文本

它们与 URL/Content 属性和类型属性 ( image/ youtube/ text) 一起保存。

更新时$scope.media我想显示正确的 HTML 模板。我有这个解决方案：

 <div ng-show="page.media.type == 'text'">{{$scope.media.paragraph}}</div>
 <img ng-show="page.media.type == 'image'" ng-src="{{$scope.media.url}}"/>
 <iframe ng-show="page.media.type == 'youtube'" ng-src="{{scope.media.url}}" frameborder="0" allowfullscreen></iframe>

我希望将其作为每种内容类型的单独 HTML 模板文件。包含此内容的页面已经是主 index.html 中某个<div ng-view></div>区域的部分模板，并且媒体视图也已经在ng-switch-whenswitch 内部。

因此，我不想添加嵌套 ng-view或ng-switch包含媒体模板。有没有其他方法可以让 $scope 更改触发单独的 HTML 模板？

4

1 回答 1

1

您应该查看ng-include，以及它从服务器或页面中包含模板 html 的能力。

<div ng-include src="templateIdentifier"></div>

该src属性可以是一个表达式，因此对模型src绑定的更改将动态更改模板。

所以你可以做一个手表，比如

$scope.$watch('$scope.media',function(media) {
    $scope.templateIdentifier='template-'+media.type;
});

如果内联定义，这就是定义模板的方式

<script type="text/ng-template" class="template" id="template-text">
    {{$scope.media.paragraph}}
</script
于 2013-07-02T14:56:00.337 回答