AngularJS 默认选择值

Question

我正在为我的家人构建一个应用程序，让您可以为每周的每场 nfl 比赛进行选择。我有一个包含周数的下拉列表。当用户选择一周时，它会在页面中填充该周的所有游戏以及每个游戏的下拉列表，以便用户进行选择。虽然可以很好地更新选择并且绑定正在工作，但加载页面时出现问题，它不会使用数据库中的选择填充下拉列表。我尝试了不同的东西，例如 ng-init 但没有运气。

我正在使用带有 Jade 模板的自定义 MEAN 堆栈。这是我的翡翠的sn-p

div(ng-controller='picksController')
h1 These are the picks
select.form-control(ng-model="selectedWeek", ng-change="getWeek(selectedWeek)", ng-options="week.week for week in weeks")
    option(value="") Select Week
div(ng-show="picks != null", ng-repeat="game in picks")
    hr.divider
    .panel.panel-primary
        .panel-heading
            h5 {{teamsMap[game.homeTeam].city + " " + teamsMap[game.homeTeam].name}} vs {{teamsMap[game.awayTeam].city + " " + teamsMap[game.awayTeam].name}}
            select.form-control(ng-model="game.pick")
                option(value='{{teamsMap[game.homeTeam].id}}') {{teamsMap[game.homeTeam].name}}
                option(value='{{teamsMap[game.awayTeam].id}}') {{teamsMap[game.awayTeam].name}}
        .panel-body
button.btn.btn-primary.submitButton(ng-show="picks != null", ng-click="updatePicks()") Submit

HTML 版本：

<div ng-controller='picksController'>
<h1>These are the picks</h1>
<select class="form-control" ng-model="selectedWeek", ng-change="getWeek(selectedWeek)", ng-options="week.week for week in weeks">
    <option value="">Select Week</option>
</select>
<div ng-show="picks != null", ng-repeat="game in picks">
    <hr class="divider">
    <div class="panel panel-primary">
        <div class="panel-heading">
            <h5>{{teamsMap[game.homeTeam].city + " " + teamsMap[game.homeTeam].name}} vs {{teamsMap[game.awayTeam].city + " " + teamsMap[game.awayTeam].name}}</h5>
            <select class="form-control" ng-model="game.pick">
                <option value="{{teamsMap[game.homeTeam].id}}">{{teamsMap[game.homeTeam].name}}</option>
                <option value="{{teamsMap[game.awayTeam].id}}">{{teamsMap[game.awayTeam].name}}</option>
            </select>
        </div>
        <div class="panel-body">

        </div>
    </div>
</div>
<button class="btn btn-primary submitButton" ng-show="picks != null", ng-click="updatePicks()"> Submit </button>

还有我的角度控制器

angular.module('app').controller('picksController', function($scope, bfNotifier, bfIdentity, bfPicks, bfWeeks, bfGames, bfTeams) {
$scope.teamsMap = {};
var teams = bfTeams.query(function() {
    for(var i = 0; i < teams.length; i++) {
        $scope.teamsMap[teams[i].id] = teams[i];
    }
});

$scope.weeks = bfWeeks.query();

$scope.getWeek = function(week) {
    if(week != null) {
        $scope.picks = bfPicks.query({"week": week.week, "user": bfIdentity.currentUser.username});
    }
}

})

picks JSON 的结构是这样的......

pick {
    user: xxx,
    week: xxx,
    game: xxx,
    homeTeam: xxx,
    awayTeam: xxx,
    pick: xxx
}

一周

week {
    id: xxx,
    week: xxx
}

即使你不能回答我的问题，如果你能引导我走向正确的方向。有时让其他人查看我的代码会有所帮助。谢谢！

Answer 1

如果您不使用 Jade，我可以提供更多帮助（使用 html？），但我没有看到您在任何地方使用 ng-options。你想在处理选择时使用ng-options。

Answer 2

您的默认值应为“xxx”
当您将模型“game.pick”与 pick["pick"] 链接时。