AngularJS和Angular-UI引导选项卡范围

问题描述

我正在使用AngularJS和Angular-UI Bootstrap选项卡.这是我的控制器:

I am using AngularJS and Angular-UI Bootstrap tabs. This is my controller:

app.controller("SettingsCtrl", ['$scope','SettingsFactory','$stateParams',  function($scope,SettingsFactory,$stateParams){


  $scope.navType = 'pills';

  $scope.saveLanguage = function()
  {
    console.log($scope.test.vari); // loged undefined
  }

}]);

我的观点

<div class="row clearfix">

  <tabset>
    <tab heading="Jezik">

     <form role="form" name="test">

        <div class="form-group">
            <label for="lang">Izaberite jezik</label>
            <select class="form-control" ng-model="vari">
              <option>Hrvatski</option>
              <option>Srpski</option>
              <option>Bosanski</option>
              <option>Engleski jezik</option>
              <option>Njemački jezik</option>
            </select>
        </div>


        <button type="submit" class="btn btn-default"  ng-click="saveLanguage()">Save</button>
      </form>

    </tab>

</div>

当我使用Angular-UI引导选项卡时，有人可以帮助我查看为什么未定义日志.它在创造自己的范围吗?如何获取模型的价值?

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 ?

推荐答案

此代码解决了我的问题(从表单中删除名称属性，添加了ng-model ="test.vari"，并添加了$ scope.test = {}在我的控制器中):

This code solved my problem (removed name atribute from form, added ng-model="test.vari", and added $scope.test= {} in my controller) :

    <tabset>
    <tab heading="Jezik">

     <form role="form">

        <div class="form-group">
            <label for="lang">Izaberite jezik</label>
            <select class="form-control" ng-model="test.vari">
              <option>Hrvatski</option>
              <option>Srpski</option>
              <option>Bosanski</option>
              <option>Engleski jezik</option>
              <option>Njemački jezik</option>
            </select>
        </div>


        <button type="submit" class="btn btn-default"  ng-click="saveLanguage()">Spremi Jezik</button>
      </form>


    </tab>
</div>





app.controller("SettingsCtrl", ['$scope','SettingsFactory','$stateParams',  function($scope,SettingsFactory,$stateParams){

      $scope.navType = 'pills';


      $scope.test= {};

      $scope.saveLanguage = function()
      {
          console.log($scope.test.vari);

        // SettingsFactory.update({ id:$stateParams.user_id }, $scope.language);
      }
}]);

这篇关于AngularJS和Angular-UI引导选项卡范围的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！