0

normal select listコードをコードに変換する方法angular-ui-select directive。

私のコードhtml：

<select class="input-small tight-form-input" ng-model="panel.valueName" ng-options="f.value as f.text for f in bigValueOptions" ng-change="render()"></select>

私のコントローラーコード:

 $scope.bigValueOptions= [{
    text: 'min',
    value: 'min'
  }, {
    text: 'max',
    value: 'max'
  }, {
    text: 'avg',
    value: 'avg'
  }, {
    text: 'current',
    value: 'current'
  }, {
    text: 'total',
    value: 'total'
  }];

私が試したこと：

<ui-select id="viewSelector"
                        class="viewSelector input-small tight-form-input"
                        ng-model="panel.valueName"
                        theme="selectize"
                        ng-change="render()">
                        <ui-select-match placeholder="Select">{{$select.selected.text}}</ui-select-match>
                        <ui-select-choices repeat="f in bigValueOptions">
                          <div ng-bind-html="f.text"></div>
                        </ui-select-choices>
                    </ui-select>

panel.valueNameは正しい値を持っていません。これを修正する方法、または通常の選択を ui-select ディレクティブ コードに変換する方法。

ガイドしてください。

4

1 に答える 1

0

それは私のために働く：プランカー

定義しました$scope.panel = {};か？

JS:

app.controller('DemoCtrl', function($scope, $http) {
  $scope.bigValueOptions= [{
    text: 'min',
    value: 'min'
  }, {
    text: 'max',
    value: 'max'
  }, {
    text: 'avg',
    value: 'avg'
  }, {
    text: 'current',
    value: 'current'
  }, {
    text: 'total',
    value: 'total'
  }];
  $scope.panel = {};
});

HTML:

<body ng-controller="DemoCtrl">
  Selected object: {{panel.valueName}}
  <ui-select id="viewSelector"
      class="viewSelector input-small tight-form-input"
      ng-model="panel.valueName"
      theme="selectize"
      ng-change="render()">
      <ui-select-match placeholder="Select">{{$select.selected.text}}</ui-select-match>
      <ui-select-choices repeat="f in bigValueOptions">
        <div ng-bind-html="f.text"></div>
      </ui-select-choices>
  </ui-select>
</body>
于 2015-09-07T18:11:00.687 に答える