Javascript 如何在ng repeat&；角度模态

刚接触Angular JS，有一个很普通的问题。我有一个ng repeat，它通过一个本地JSON文件填充一些数据，当单击时，会显示关于指定公司的一些更详细的信息。我现在想做的是让用户能够使用屏幕上的箭头或键盘箭头（像大多数类似照片的框）在每家公司之间“翻页”

以下是我的HTML代码：

<div id="portfolio" class="showcase-list stripe" ng-controller="portfolio" id="stripe-showcase">
<div class="contain">
    <h3>Our Companies</h3>
    <a ng-repeat="co in companies" href="#{{co.name}}" class="showcase" ng-click="open(co)">
        <div class="image" id="{{co.name}}">
            <span class="helper"></span>
                <img class="displayed" src="{{co.logo}}">
            <div class="caption">

            </div>
        </div>
        <!--MODAL WINDOW-->
        <script type="text/ng-template" id="myModalContent.html">
            <div class="modal-header">
                <img class="displayed lightbox" src="{{co.logo}}">
            </div>
            <div class="modal-body">
                {{ co.investor_description }}
            </div>
            <div class="modal-footer">

            </div>
        </script>
    </a>
    <div id="{{co.name}}" class="flipbox-dialog"><p>{{co.investor_description}}</p></div>
</div>

---

我不知道从哪里开始……有人能给我指出正确的方向吗？？我将非常感激

也许可以尝试将JS中的“prev”和“next”按钮和值指定为简单链接

和或在myModalContent.html中创建“上一页”和“下一页”按钮

希望这能有所帮助

var app = angular.module('app', ['ui.bootstrap']);

app.controller('ModalInstanceCtrl', function($scope, $modalInstance, co) {
    console.log("that");
    $scope.co = co;
});

app.controller('portfolio', function($scope, $timeout, $modal) {

$scope.companies = [{
    "investor_description": "Apportable\u2019s platform allows iOS applications to run on Android devices automatically, without requiring extensive changes to the original Objective-C or C++ code.",
    "name": "Apportable",
    "logo": "http://api-images.crunchbase.com/assets/images/resized/0018/5576/185576v7-max-450x450.png",
    "url": "http://www.apportable.com/",
    "linkedin_url": null,
    "crunchbase_url": "http://www.crunchbase.com/company/apportable",
    "angellist_url": "https://angel.co/apportable",
    "twitter_url": "http://twitter.com/apportable"
}, {
    "investor_description": "Your Personalized English-Speaking School\r\n\r\nSpeed towards English fluency with 24/7 online conversation classes and 1-on-1 SpeakAssist study program",
    "name": "Colingo",
    "logo": "http://www.m.com/wp-content/uploads/2012/04/colingo_logo.png",
    "url": "http://www.colingo.com",
    "linkedin_url": "",
    "crunchbase_url": "http://www.crunchbase.com/company/colingo",
    "angellist_url": "https://angel.co/colingo",
    "twitter_url": "https://twitter.com/colingo"
}, {
    "investor_description": "DataTorrent Inc builds technology that enables next generation, real-time big data applications on Hadoop.",
    "name": "DataTorrent",
    "logo": "http://www.m.com/wp-content/uploads/2013/08/Datatorrent-logo.png",
    "url": "http://www.datatorrent.com",
    "linkedin_url": "http://www.linkedin.com/company/malhar-inc-",
    "crunchbase_url": "http://www.crunchbase.com/company/datatorrent",
    "angellist_url": "https://angel.co/datatorrent",
    "twitter_url": "http://twitter.com/datatorrent"
}];

$scope.open = function (_co) {
    console.log("this");
    var modalInstance = $modal.open(
        {
            controller: "ModalInstanceCtrl",
            templateUrl: 'myModalContent.html',
            resolve: {
                co: function () {
                    return _co;
                }
            }
        });
};
});