9

が入力された選択ボックスがありますng-options。次のように、デフォルトのオプションを手動で追加できることを知っています。

<select ng-model="selectedAddress" ng-init="selectedAddress = selectedAddress || address_dropdown[0].value" ng-change="handleStoredAddressClick2()" ng-options="a.dropdown_display for a in address_dropdown"  id="address_dropdown">
    <option value="" ng-selected="selected">Add a new address</option>
</select>

複数のオプションを追加する方法はありますか? クライアントは、最初のデフォルト オプションに「アドレスから選択」を指定し、上に示した [新しいアドレスの追加] オプションをリストの最後のオプションにする必要がありますng-options。

(jQuery を使用してそのオプションを追加できることはわかっていますが、可能であればすべて角度を維持したいと考えています。)

4

3 に答える 3

6

編集 2: 反対票を投じる方へ: お気づきかもしれませんが、この投稿は 2014 年 3 月のものです。ソース、Luke を使用してください! （私はもうangularJsには興味がありません）

編集：エミーが言及したように、これは「モデルを文字列以外にバインドしたい場合」には機能しません！

これを試して：

    <select ng-model="YourModel">
      <option value="" ng-selected="selected">an option</option>
      <option ng-repeat="item in items">{{item.name}}</option>
      <option value="">another option</option>
    </select>

良い週末を！

于 2014-03-21T15:20:54.977 に答える
0

ngOptions を使用せずにオプションを手動で追加する例を次に示しますが、質問に関連すると思われるモデルにバインドされています。

http://jsfiddle.net/armyofda12mnkeys/cd6d5vfj/8/

注: 空の「--選択してください--」オプションと「新しいユニットを追加」オプションを真ん中に置いて、それらがどのように選択されるかを確認しました。デフォルトでは、ページ ng-selected の土地が「新しいユニットの追加」を true に設定するとき (そのモデルが空で、最後の true を選択するだけなので、angular が「--Please Choose--」をスマートに検出することも選択された可能性があるのではないかと思います通常のドロップダウンで 2 つのオプションを選択できないことを知っていますか?)。

$scope.currentquestion.someOtherParam = falseを設定した場合。実行すると、--Please choose --がデフォルトの選択肢として表示されます。

次に、$scope.currentquestion.metric_pref = 'stn';を設定します。実行すると、石がデフォルトとして設定されます。

次に、別のオプションを変更すると、モデルが更新されていることがわかります。

<div ng-app="myApp">
    <div ng-controller="MyCtrl">

        <h3>{{currentquestion.text}}</h3>

        <select 
          ng-model="currentquestion.metric_pref"
          name="{{currentquestion.qid}}"
          id="{{currentquestion.qid}}"       
         >

         <option value="kg">
              kg.
         </option>
         <option value="">
             --Please choose--
         </option>
         <option value="lbs">
              pounds
         </option>
        <option value="add" ng-selected='currentquestion.someOtherParam'>
             Add new unit
         </option>
         <option value="stn">
              stones            
         </option>

        </select>
        CurrentVal:{{currentquestion.metric_pref}}
    </div>
</div>
var myApp = angular.module('myApp', []);

myApp.controller("MyCtrl", function ($scope) {
    $scope.currentquestion = {};
    $scope.currentquestion.qid = "QS1";
    $scope.currentquestion.text = "What unit do you prefer to state your weight in?";    
    $scope.currentquestion.metric_pref = '';//can put stn in here to default at stones
    $scope.currentquestion.someOtherParam = false;
    //$scope.currentquestion.unit_options = [ 'lbs' , 'stones' , 'kg' ]; //lbs. for US, stones for UK, metric for others
    //not using ng-options to build the value/text of the option as I need to use ng-translate in the code

});
于 2015-04-09T17:01:59.500 に答える