我在离子幻灯片中使用ng-include：
<ion-slide>
<div ng-include src="'vid.html'"></div>
</ion-slide>
<ion-slide>
<div ng-include src="'templates/rooms.html'"></div>
</ion-slide>
<ion-slide>
<div ng-include src="'templates/splash2.html'"></div>
</ion-slide>
Vid.html不在模板中，它位于根文件夹中，而且此文件是全屏视频：
<!-- Video Markup -->
<section class="masthead">
<!-- Directive as an Element -->
<covervid class="masthead-video" autoplay loop muted height="720" width="1280">
<source src="assets/videos/dreamscapes.mp4" type="video/mp4">
<source src="assets/videos/dreamscapes.webm" type="video/webm">
</covervid>
<!-- Directive as an Attribute -->
<!-- <video covervid class="masthead-video" autoplay loop muted height="720" width="1280">
<source src="assets/videos/dreamscapes.mp4" type="video/mp4">
<source src="assets/videos/dreamscapes.webm" type="video/webm">
</video> -->
<div class="masthead-overlay"></div>
<div class="masthead-arrow"></div>
<h1>NgCoverVid<span>Angular Background Video Cover</span></h1>
<a class="masthead-video-credit" href="http://vimeo.com/82495711" target="_blank">
<span>Video: Dreamscapes</span>
<span>by Jonathan Besler</span>
</a>
</section>
<section class="content">
<div class="container">
<h2>Special Thanks</h2>
<p>A special thanks and shoutout to <a href="http://github.com/stefanerickson">Stefan Erickson</a> for creating the original <a href="http://github.com/stefanerickson/covervid">CoverVid</a>.</p>
<h2>Why is it special?</h2>
<p>For starters, it makes your HTML5 video behave like a background cover image, but other plugins also do that. NgCoverVid is very lightweight, with only 1279 bytes of Javascript. Its logic is parent based, meaning the parent element can be any size (Not necessarily just a full-screen background).</p>
<h2>How do I use it?</h2>
<ol>
<li>First pull the project down from <a href="http://github.com/jfeigel/ngCovervid">GitHub</a> or install it through <a href="http://www.bower.io">Bower</a> and link <code>ngCovervid.min.js</code> into your site.<pre>bower install ng-covervid</pre></li>
<li>Add ngCovervid as a dependency of your Angular application.<pre>angular.module(<span class="nt">'app'</span>,[<span class="nt">'ngCovervid'</span>]);</pre></li>
<li>It is important to note that the video you target will use its parent element to scale. With that in mind, we will create some simple markup and add some base styling to size the videos' parent/wrapper element. The directive must be declared as either an attribute of a video element or as an element itself.<br/><br/><div>ATTRIBUTE</div><pre><span class="nt"><div</span> <span class="na">class=</span><span class="s">"covervid-wrapper"</span><span class="nt">></span>
<span class="nt"><video</span> <span class="na">covervid</span> <span class="na">class=</span><span class="s">"covervid-video"</span> <span class="na">autoplay</span> <span class="na">loop</span>
<span class="na">poster=</span><span class="s">"img/video-fallback.png"</span><span class="nt">></span>
<span class="nt"><source</span> <span class="na">src=</span><span class="s">"videos/clouds.webm"</span> <span class="na">type=</span><span class="s">"video/webm"</span><span class="nt">></span>
<span class="nt"><source</span> <span class="na">src=</span><span class="s">"videos/clouds.mp4"</span> <span class="na">type=</span><span class="s">"video/mp4"</span><span class="nt">></span>
<span class="nt"></video></span>
<span class="nt"></div></span>
</pre><div>ELEMENT</div><pre><span class="nt"><div</span> <span class="na">class=</span><span class="s">"covervid-wrapper"</span><span class="nt">></span>
<span class="nt"><covervid</span> <span class="na">class=</span><span class="s">"covervid-video"</span> <span class="na">autoplay</span> <span class="na">loop</span> <span class="na">poster=</span><span class="s">"img/video-fallback.png"</span><span class="nt">></span>
<span class="nt"><source</span> <span class="na">src=</span><span class="s">"videos/clouds.webm"</span> <span class="na">type=</span><span class="s">"video/webm"</span><span class="nt">></span>
<span class="nt"><source</span> <span class="na">src=</span><span class="s">"videos/clouds.mp4"</span> <span class="na">type=</span><span class="s">"video/mp4"</span><span class="nt">></span>
<span class="nt"></covervid></span>
<span class="nt"></div></span>
</pre><br/><div>STYLES</div><pre><span class="nc">.covervid-wrapper</span> <span class="p">{</span>
<span class="k">position</span><span class="o">:</span> <span class="k">absolute</span><span class="p">;</span>
<span class="k">top</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="k">left</span><span class="o">:</span> <span class="m">0</span><span class="p">;</span>
<span class="k">width</span><span class="o">:</span> <span class="m">100%</span><span class="p">;</span>
<span class="k">height</span><span class="o">:</span> <span class="m">100%</span><span class="p">;</span>
<span class="p">}</span>
</pre></li>
<li>You have the option to include the native height and width of the video as attributes of the element or let the directive determine them for you. Note that including these values as attributes will ensure there is no lag in the initial sizing of the video as the directive needs to wait for the video's metadata to load before it can resize the video.<pre><span class="nt"><covervid</span> <span class="na">class=</span><span class="s">"covervid-video"</span> <span class="na">autoplay</span> <span class="na">loop</span> <span class="na">poster=</span><span class="s">"img/video-fallback.png"</span>
<span class="na">height=</span><span class="s">"720"</span> <span class="na">width=</span><span class="s">"1280"</span><span class="nt">></span></pre></li>
</ol>
</div>
</section>
现在，当我手动导航到这个vid.html页面时，它显示正常，我看到我的全屏视频，但是当我通过ng-src包含它时，它向我展示了每一个视频。我错过了什么吗？