title: AngularJS and Angular-UI Bootstrap tabs scope
body: <p>I am using AngularJS and Angular-UI Bootstrap tabs. This is my controller:</p>
  
  <pre><code>app.controller("SettingsCtrl", ['$scope','SettingsFactory','$stateParams',  function($scope,SettingsFactory,$stateParams){
  
  
    $scope.navType = 'pills';
  
    $scope.saveLanguage = function()
    {   
      console.log($scope.test.vari); // loged undefined
    }
  
  }]);
  </code></pre>
  
  <p><strong>My view</strong></p>
  
  <pre><code>&lt;div class="row clearfix"&gt;
  
    &lt;tabset&gt;
      &lt;tab heading="Jezik"&gt;
  
       &lt;form role="form" name="test"&gt;
  
          &lt;div class="form-group"&gt;
              &lt;label for="lang"&gt;Izaberite jezik&lt;/label&gt;
              &lt;select class="form-control" ng-model="vari"&gt;
                &lt;option&gt;Hrvatski&lt;/option&gt;
                &lt;option&gt;Srpski&lt;/option&gt;
                &lt;option&gt;Bosanski&lt;/option&gt;
                &lt;option&gt;Engleski jezik&lt;/option&gt;
                &lt;option&gt;Njemački jezik&lt;/option&gt;
              &lt;/select&gt;
          &lt;/div&gt;
  
  
          &lt;button type="submit" class="btn btn-default"  ng-click="saveLanguage()"&gt;Save&lt;/button&gt;
        &lt;/form&gt;
  
      &lt;/tab&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p>Can someone help me to see why is loging undefined when I am using Angular-UI Bootstrap Tabs. Is it creating own scope. How tu access model value ? </p>