Question

Angular.js让我发疯，Ben Nadel angular.js roller coster可能会让我保持理智！

我们说我们有这个基本的控制器：

function ResultsCtrl($scope) {$scope.results = {
'Autumn 2011': {
     'Courses': [{code: 'GS515', 'grade': 80}, {code: 'GS505', 'grade': 60}],
     'Statistics': [{}]
               },
'Autumn 2012': {}/*SIMILAR DATA STRUCTURE*/
$scope.selectedPeriod = 'Autumn 2011';/*FOR INITIALISING THE DATA*/
};

然后在html代码中，ng-repeat基于选择在数组上使用：

<div ng-app>
<div ng-controller="ResultsCtrl">
    <div>
        <select ng-options="period as period for (period, result) in results" ng-model="selectedPeriod"></select>
    </div>
     <div ng-repeat="course in results['{{selectedPeriod}}']['Courses']">
        <p>Course: {{ course.code }}, Grade: {{ course.grade }}</p>
    </div>
</div>

上面是我的第一个方法，然后我尝试在ng-repeat中对数组进行硬编码以查看问题所在并且工作正常：<div ng-repeat="course in results['Autumn 2011']['Courses']">。下一种方法尝试使用控制器来选择阵列。这已添加到脚本中：$scope.periodResults = $scope.results[$scope.selectedPeriod]['Courses'];和periodResults用于ng-repeat，但它不起作用，默认数组已正确加载，但<select>标记已没有效果。

我已经看到有关类似问题的问题和博文，但他们没有帮助。所有这些都与$scope.apply()或$timeout有关，我对此并不了解。

Answer 1

你错过了$ scope.results的结束括号：

function ResultsCtrl($scope) {$scope.results = {
'Autumn 2011': {
     'Courses': [{code: 'GS515', 'grade': 80}, {code: 'GS505', 'grade': 60}],
     'Statistics': [{}]
               },
'Autumn 2012': {}/*SIMILAR DATA STRUCTURE*/
} /* this closing brace was missing */
$scope.selectedPeriod = 'Autumn 2011';/*FOR INITIALISING THE DATA*/
};

在您的模板中，您在引用selectedPeriod模型时错误地使用了角度表达式。以下是模板的外观：

<div ng-app>
<div ng-controller="ResultsCtrl">
    <div>
        <select ng-options="period as period for (period, result) in results" ng-model="selectedPeriod"></select>
    </div>
     <div ng-repeat="course in results[selectedPeriod]['Courses']">
        <p>Course: {{ course.code }}, Grade: {{ course.grade }}</p>
    </div>
</div>

请注意使用[selectedPeriod]代替[＆＃39; {{selectedPeriod}}＆＃39;]，就像您在代码中一样。

根据选择输入更新ngRepeat数组

1 个答案: