normal select list to angular-ui-select is not working

How to convert normal select list code into angular-ui-select directive code.

My code 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>

My controller code:

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

What I have tried:

<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 is not having correct value. How to fix this or how to convert normal select into ui-select directuve code.

Please guide.

Solution

It works for me: Plunker

Did you defined $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>