数据绑定不适用于Ionic Cards

Question

好吧，我有一个包含离子卡的html页面，但是当我将数据绑定到它的项目时，它们不会显示在浏览器上，那么问题是什么

<ion-view title="Game" ng-controller="GameCtrl as vm">
    <ion-content class="has-header">
        <div class="card">
            <div class="item">
                Home Team
            </div>
            <div class="item">
              {{vm.game.team1}}
            </div>
            <div class="item">
                Score: {{vm.game.team1Score}}
            </div>
        </div>
        <div class="card">
        </div>
        <div class="card">
        </div>
    </ion-content>
</ion-view>

以下是此页面的角度控制器：

(function () {
    'use strict';

    angular.module('eliteApp').controller('GameCtrl', ['$stateParams','eliteApi', GameCtrl]);

    function GameCtrl($stateParams, eliteApi) {
        var vm = this;

        var gameId = Number($stateParams.id);
        var data = eliteApi.getLeagueData();
        vm.game = _.find(data.games,{"id": gameId});

    };
})();

我将js文件注入index.html;在跟踪调试时，函数正在获取数据但是数据不会在浏览器中查看，所以有人可以帮忙吗？

Answer 1

试试这个：

'use strict';

angular.module('eliteApp').controller('GameCtrl', ['$stateParams','eliteApi', function($stateParams, eliteApi){
 var gameId = Number($stateParams.id);
    var data = eliteApi.getLeagueData();
    this.game = _.find(data.games,{"id": gameId});
}]);

修改

看起来你错过了一个有游戏ID的路线。将其添加到.config函数：

 .state('app.game-detail', {
    url: "/game/:id",
    views: {
      "mainContent":{
        templateUrl: "app/game/game.html"
      }
    }
  })

用这个改变你的team-detail.html：

  <a class="item item-icon-right" ng-repeat="game in vm.games"
           href="#/app/game/{{game.gameId}}">

现在应该可以了。