Angularjs和JQuery在页面之间传递数据

Question

我目前正在尝试使用AngularJs和Jquery mobile开发一个webapp。

我在index.html文件上有以下代码

<ul>
<li>
<input type="hidden" value="cat">
<a href="#details">Cat</a>
</li>
<li>
<li>
<input type="hidden" value="dog">
<a href="#details">Dog</a>
</li>
</ul>

我的angularjs数据如下所示

$scope.cats = [{name:'Cat1'},{name:"Cat2"},{name:"Cat3"}]

$scope.dogs = [{name:'Dog1'},{name:"Dog2"},{name:"Dog3"}]

我已经有一个名为#details的内嵌页面。

所以，我需要的是当用户点击“cat”时，#details页面应该打开

<ul ng-repeat="cat in cats"><li>{{cat.name}}</li><ul>

当用户点击“dog”时，#details页面应该打开

<ul ng-repeat="cat in cats"><li>{{cat.name}}</li><ul>

请在此帮忙。 （抱歉我的英语不好）