我在具有ui-view元素的应用程序的基础上开始了一个新站点:
<section id='gallery' ui-view>
</section>
此元素默认加载home.html,其中包含帖子列表&#39;通过ng-repeat生成的预览:
---
name: home
url: /
---
<div class="grid-block medium-up-4">
<div class="grid-block vertical gallery-items" ng-repeat='galleryItem in galleryItems | filter: tag' ng-class="{ 'hidden': ! showDetails }">
<div class="grid-block" ng-mouseover='hoverInfo = true' ng-mouseleave='hoverInfo = false'>
<a ui-sref="galelem" class='gallery-element grid-block vertical'>
<span class='preview'>{{galleryItem.tags | divideTags}}</span>
<p>However beautiful the strategy, you should occasionally look at the results.</p>
<div ng-show='hoverInfo' class='hover-info grid-block vertical'>
<span class='on-hover'>{{galleryItem.tags | divideTags}}</span>
<span class='view'>View Gallery</span>
</div>
</a>
</div>
<hr>
<div class="grid-block">
<div class="grid-block meta"><span>{{galleryItem.date}} / <span class='comments'> {{galleryItem.comments}} Comments</span></span></div>
<div class="grid-block social-small ">
<a href=""><i class='fa fa-envelope'></i></a>
<a href=""><i class='fa fa-facebook'></i></a>
<a href=""><i class='fa fa-twitter'></i></a>
</div>
</div>
</div>
</div>
当我点击带有ui-sref =&#39; galelem&#39;的锚标签时,ui-view会加载另一个html文件,其中包含有关帖子的详细信息:
---
name: galelem
url: /galelem
---
<div class="post-element grid-block vertical">
<img src="http://placehold.it/1200x600" alt="" class='main-image'>
<div class="grid-block vertical text-info">
<span class='preview'>{{galleryItem.tags}}</span>
<p>However beautiful the strategy, you should occasionally look at the results.</p>
<div class="grid-block meta"><span>{{galleryItem.date}} / <span class='comments'> {{galleryItem.comments}} Comments</span></span></div>
<div class="grid-block social-small ">
<a href=""><i class='fa fa-envelope'></i></a>
<a href=""><i class='fa fa-facebook'></i></a>
<a href=""><i class='fa fa-twitter'></i></a>
</div>
<hr>
<a href="">previous post</a>
<a href="">next post</a>
<span>Embeded Code</span>
<pre class='embeded-code'>
<h3>VAGNER HERNANDEZ</h3><p class="imgC"><a href="http://elpassion.com/post/97850349571"><img src="http://38.media.tumblr.com/6fd0334606ad04b061abda2d462d3f2c/tumblr_nc2n0tAsmp1r46py4o1_1280.jpg" /></a></p>
</pre>
<div class="feedback">
<p><img src="http://placehold.it/25x25" alt=""><span>bj_unoxx </span>reblogged this from<span>constellation</span></p>
<p><img src="http://placehold.it/25x25" alt=""><span>mike_dosxx</span>reblogged this from<span>constellation</span></p>
<p><img src="http://placehold.it/25x25" alt=""><span>tre_leparc</span>submitted this to<span>constellation</span></p>
</div>
</div>
</div>
当我点击&#39; a&#39;元素网站加载页面包含详细信息,但没有角度信息,如{{galleryItem.tags}}。我想要这个带有详细信息的html文件来获取有关所点击帖子的数据,并显示预览中包含的相同信息。我怎样才能做到这一点?到目前为止,我的js文件只包含一个ng-repeat从中获取数据的对象。我试图寻找答案,但没有发现它是angularjs的新手。