1

2 つのコンボボックスを含むページがあります。これは私の見解です:

<div ng-init="loadComboBox()">
 <select class="form-control" ng-model="SelectedItem1" ng-options="employee.FirstName for employeein Employees">
<select class="form-control" ng-model="SelectedItem2" ng-options="employeePlan.PlanName for employeePlan in Plans">
</select>
</div>

this is my controller : このコントローラーは、API 呼び出しを行うサービスを呼び出します。

angular.module('myApp').controller('EmployeeCtrl',
    function($scope, $http, EmpSvc, ngProgress, PlanSvc) {

        $scope.Employees= null;
        $scope.Plans= null;
        $scope.SelectedItem1 = '';
        $scope.SelectedItem2 = '';
        $scope.loadComboBox= function() {
            ngProgress.start();
            EmpSvc.getEmployees().then(function(data) {
                $scope.Employees= data;    
                $scope.SelectedItem1 = $scope.Employees[0].FirstName;
            });

            PlanSvc.getPlans().then(function(plans) {
                $scope.Plans = plans;    
                $scope.SelectedItem2 = $scope.Plans[0].PlanName;
            });

            ngProgress.complete();
        }

});

コントローラーはサービスを適切に呼び出し、スコープ値にもデータを取得します。値はScope.SelectedItem1Scope.SelectedItem2に割り当てられますが、UI 側では表示されません。$scope.$$apply() も実行しようとしましたが、どちらも機能しませんでした。

コンボボックスはドロップダウンにすべての値を表示しますが、コンボボックスに少なくとも1つのデフォルト値を入力したいです。誰かがそれを手伝ってくれますか?

基本的に、ページが読み込まれる前にAPIからコンボボックスを読み込みたい

4

1 に答える 1

0

$scope オブジェクトで $scope.Employees と $scope.Plans を直接使用していないと思います。$scope に空のオブジェクトを作成する必要があります。

例えば、

$scope.vm = {};
$scope.vm.employees = {};
$scope.vm.plans = {};

plnkr であなたの問題の例を作成しました。http://plnkr.co/edit/rKyjijGWSL1IKy51b8Tv?p=preview にアクセスしてください

于 2014-10-20T11:06:39.757 に答える