AngularJS 和 Angular-UI Bootstrap 选项卡作用域

标签 angularjs tabs scope angular-ui-bootstrap

我正在使用 AngularJS 和 Angular-UI Bootstrap 选项卡。这是我的 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 Bootstrap 选项卡时未定义日志记录。是否创建自己的范围。你如何访问模型值?

最佳答案

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

    <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 Bootstrap 选项卡作用域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22772041/

相关文章:

html - Angular 元标记信息未在 google 中显示

javascript - 如何在对象数组中查找和编辑对象的属性?

Android Tab教程问题

python - 验证错误 : Redefined outer name from outer scope

javascript - 如果 JavaScript 中的 var 定义了两次,解释器应该采用哪个定义?

angularjs - 单击打开的非 Angular 页面 - 未使用ignoreSynchronization定义 Angular 或等待Angular而不使用

javascript - AngularJS ng-重复和过滤

android - Android 中的选项卡无法正常工作?

Vim:全局标记可以切换选项卡而不是当前选项卡中的文件吗?

javascript - Ng-click 不起作用