javascript - AngularJS - 对象上的 ng-repeat

标签 javascript angularjs

我有一个具有 2 个属性的对象列表:标签和描述。在 html 上,我在此列表上循环:

<select class="form-control" 
     ng-options="fid.label for fid in myFidList" 
     ng-model="fidSelected" 
     ng-change="setFidDescription()"/>

我想做的是调用一个函数(setFidDescription)来获取我在选项标签上选择的对象。所以我可以在另一个div中更改相应的描述。这似乎不起作用:ng-model 似乎没有更新。功能:

 $scope.setFidDescription = function () {
    console.log($scope.fidSelected);
 }

此代码打印一个空对象。 我缺少什么?另一种方法是获取我选择的 $index。

更多信息: JSON + console

更新: 我找到了我的问题。请参阅此处的说明:

AngularJS ngModel doesn't work inside a ui-bootstrap tabset

那是我的问题。

最佳答案

// Code goes here

angular
  .module('myApp', [])

.controller('testController', ['$scope',
  function($scope) {

    $scope.myFidList = [{
      label: 'label1',
    }, {
      label: 'label2',
    }]

    $scope.setFidDescription = function() {
      alert($scope.fidSelected.label);
    }

  }
])
<!DOCTYPE html>
<html data-ng-app="myApp">

<head>
  <link rel="stylesheet" href="style.css">
  <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
  <script src="script.js"></script>
</head>

<body data-ng-controller="testController">



  <select class="form-control" ng-options="fid.label for fid in myFidList" ng-model="fidSelected" ng-change="setFidDescription()"></select>

</body>

</html>

希望这对您有帮助。

关于javascript - AngularJS - 对象上的 ng-repeat,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40416386/

相关文章:

javascript - Angular js 中出现错误 "ReferenceError: angular is not defined"

javascript - 如何修改php中的json_encode函数文件?

javascript - mysql查询子孙

javascript - jQuery 插件或带有 css 的 jQuery 用于弹出窗口

angularjs - 子范围与隔离范围中的行为 bindToController

php - Laravel 路线不适用于生产

javascript - 如何在jquery中获取输入文本值

javascript - Openlayers:如何根据功能选择应使用哪种样式的弹出窗口?

javascript - 有没有办法用 CSS 在光标和输入中的占位符文本之间添加空格?

javascript - 使用中的属性(property)未更新