Question

<input type="text" ng-model= "name" title="{{name}}"> //此标题显示名称包含的ng-model

以同样的方式......

<select title ="{{item.actionId}}" ng-model="item.actionId"> 
<option ng-repeat="action in actionList" value="{{action.ACTION_ID}}">{{action.URL}}</option>
</select>

的ActionList： -

$scope.actionList = [{
    "ACTION_ID": 39,
    "URL": "/abc"
  }, {
    "ACTION_ID": 59,
    "URL": "/xyz"
  }];

此处item是父列表。我得到了标题，因为它的id是id。在这里，我想获得相应的网址。我怎样才能获得网址。

Answer 1

JSON数据和代码看起来很好，如果您遗漏了任何内容，请查看下面的演示。

样本

＆＃13;

var app = angular.module('myApp', []);
app.controller('AppCtrl', function($scope) {
 $scope.actionList = [{
    "ACTION_ID": 39,
    "URL": "/abc"
  }, {
    "ACTION_ID": 59,
    "URL": "/xyz"
  }];
});

＆＃13;

<!DOCTYPE html>
<html>
<head> 
</head>

<body>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
 <div ng-app="myApp" ng-controller="AppCtrl">
  <div class="form-group">
    <select title ="{{item.actionId}}" ng-model="item.actionId"> 
<option ng-repeat="action in actionList" value="{{action.ACTION_ID}}">{{action.URL}}</option>
</select>
</div>
 </div>
</body>

</html>

＆＃13;

Answer 2

您可以使用ng-options和ng-change来捕获ID并在标题上显示网址

＆＃13;

var app = angular.module('app', []);
app.controller('Ctrl', function($scope) {
 $scope.actionList = [{
    "ACTION_ID": 39,
    "URL": "/abc"
  }, {
    "ACTION_ID": 59,
    "URL": "/xyz"
  }];
  $scope.getValues=function(){
  debugger
    $scope.selectedID=$scope.item.ACTION_ID;
    $scope.selectedURL=$scope.item.URL;
    console.log("selectedId:" + $scope.selectedID );
  }
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html>
<head> 
</head>

<body>
 <div ng-app="app" ng-controller="Ctrl">
  <div class="form-group">
    <select ng-model="item" ng-change="getValues()" ng-options="action as  action.URL for action in actionList" title="{{selectedURL}}"> 
</select>
</div>
 </div>
</body>

</html>

＆＃13;

Answer 3

您可以像下面的代码一样：

<select ng-model="item" ng-options="action as action.URL for action in 
 actionList" title="{{item.URL}}">

Answer 4

您应该使用 ng-option而不是ng-repeat 。从对象

创建时，始终使用 track by 子句在选项列表中设置值

<!DOCTYPE html>
<html>
<body>

<select ng-model="item" ng-options="action as action.URL for action in actionList track by action.URL" >
  <option value="">Volvo</option>
     </select>

</body>
</html>

如何用ng-repeat显示标题

4 个答案: