angularjs - アンギュラ JS. 反復可能な選択ディレクティブで ng-model を正しく設定する

Question

AngularJS の学習を始めたばかりです。オプションを入力するためにサーバー側の作業を行う必要があるため、選択フォーム項目を繰り返すために、このコントローラーとディレクティブを作成しました。

HTML のディレクティブは次のとおりです。

<form-dropdown ng-init="getDropdown('category')" class="form-control"></form-dropdown>

以下は、各ドロップダウンのスクリプトに .get を実行するコントローラーとディレクティブです。

$scope.getDropdown = function(query) {
        $http.get('assets/php/get_dropdown.php?op='+query)
        .success(function(data, status) {
                    $scope.select = data;
        });
};

myFormElementApp.directive('formDropdown', function() {
          return {
                restrict: 'E',
                scope: true,
                replace: true,
                template: '<select id="{{select.name}}" name="{{select.name}}" ng-options="template.key for template in select.items"></select>'
          };
    });

これは、スクリプトから返された JSON で、select にデータを入力します。

{
    "name":"category",
    "items":[
         {"key":"Choose Category","value":""},
         {"key":"Shirts","value":"shirts"},
         {"key":"Pants","value":"pants"},
         {"key":"Shoes","value":"shoes"},
         {"key":"Accessories","value":"accs"},
         {"key":"Cosmetics","value":"cosmetics"},   
         {"key":"Gift cards","value":"giftcards"}
    ]
} 

ng-model を JSON からの「名前」にしたいのですが、ディレクティブ テンプレートに入れるたびにエラーが発生します。また、選択オプションの値を JSON の「値」と「キー」のテキストから取得したいと考えています。あるべき場所に「キー」がありますが、値は配列内のその項目の順序 (0、1、2 など) であり、これらのいずれかをすべての選択の最初の要素として持っています。

<option value="?" selected="selected"></option>

モデルが正しく設定されていないためにこれが発生する理由を他の場所で読みました。ng-model を正しく設定できるようにするには、コントローラーまたはディレクティブをどのように書き直せばよいですか?