如何用Angular正确开发这个?

时间:2014-10-05 00:02:58

标签: javascript angularjs angularjs-routing

嗨,这是我的第一个问题,我不确定如何正确地制定它,但在这里:

我有这段代码可以正确填充我的容器:

<div class="container" > 
         <div class="row" id="bets" ng-app="betsApp" ng-controller="betsController">
            <div ng-repeat="bet in betsList" class="item col-lg-3 col-sm-4 col-xs-6">
              <a href="pages/match.html">
                <p id="timer"></p>
                <img src="http://placehold.it/800x600" class="img-matchs img-responsive"></img>
              </a>
              <br></br>
            </div>
        </div>
</div>

它创建一个图像网格,每个图像代表一个匹配/下注。现在,当用户点击一个图像并且我必须将他/她重定向到我已经开发的匹配页面并且我想完成关于该特定匹配的数据时,我得到了该部分,当然使用Angular。 我的问题是:如何最好地解决这个问题?我一直在阅读Angular路由和UI路由(如果我没有弄错的话,它适用于一个我不使用的视图)。这是我设计的主要疑问。

以下是主应用的代码:

angular.module('betsApp', [
  'betsApp.controller'
]);

控制器:

angular.module('betsApp.controller', []).
controller('betsController', function($scope) {

    $scope.betsList = //get the betsList 

});

如果有另一种(更简单,更快捷)的方法,我愿意接受建议。希望我很清楚。

编辑:如果你能提供最好的编码示例。

1 个答案:

答案 0 :(得分:0)

使用路线听起来非常好。您将使用此功能描述一个单页的Web应用程序,它具有几个优点,其中最大的优点是速度。如果没有js,css,图像等的同步重新加载,用户体验会很好而且很快捷。

您提到您没有“拥有”视图,但调整代码以使用视图应该是微不足道的。关于此的文档相对友好。

编辑

我假设您有办法让页面通过AJAX加载投注/匹配视图的详细信息。如果你没有设计后端,这将是一个更大的时间投入。但这是一个很好的学习模式。