ng-model返回值的名称代替实际值

我有阵列纳克重复的表：

<tr ng-repeat="oblig in Obligations">

oblig对象包含连接到另一阵列ChargeOptions的chargeOptionId属性。

在表格内部有一个select元素，我想要显示收费选项oblig的详细信息。

的html代码：

<select class="form-control full-width" ng-model="oblig.ChargeOptionId"> 
     <option ng-selected="ch.Id == oblig.ChargeOptionId" value="ch.Id" ng-repeat="ch in ChargeOptions">{{ch.Account}}</option> 
</select>

的select元素显示充电选项的细节，因为我想要的，但是当我尝试保存oblig，到位的ch.Id价值oblig.ChargeOptionId="ch.Id"字符串。

我尝试：使用ng-value

1），但在选择显示不正确的数据。

2）ng-options，但仍然数据显示不正确。

我该如何解决这个问题？

来源

2016-12-05 Ariela

您可以发布您'oblig' JSON？ – Nishant123

提供完整的代码。这不清楚。 – Deadpool

当我将它改为value =“{{ch.Id}}”或ng-value =“ch”时，您应该查看NgOption属性https://docs.angularjs.org/api/ng/directive/ngOptions –

变化

value="ch.Id"

到

value="{{ch.Id}}"

或

ng-value="ch.Id"

属性 “值” 不形成棱角指令（如纳克模型和NG-值是），所以它不知道你打算将“ch.Id”作为一个变量。

jsbin

来源

2016-12-05 08:41:54

.Id“ng-selected不起作用，并且没有选择充电选项。 – Ariela

所以问题是下拉没有得到初始值？我会将我的jsbin添加到我的答案中，您可以看到它是否按照您的方式工作，或者我误解了这个问题。 –

我发现这个问题：当ChargeOptionId类型为int时，typeof ch.Id是字符串。我将它们更改为相同类型，问题已修复。 – Ariela

我不知道发生了什么之前失败，但是这似乎工作：我用ng-options代替ng-repeat。

这似乎这样的伎俩：

angular.module('app', []).controller('Ctrl', function($scope) { 
 
    $scope.Obligations = [ 
 
    { ChargeOptionId: 1 }, 
 
    { ChargeOptionId: 2 }, 
 
    { ChargeOptionId: 3 }, 
 
    { ChargeOptionId: 4 }, 
 
    { ChargeOptionId: 5 }, 
 
    { ChargeOptionId: 6 }, 
 
    { ChargeOptionId: 7 } 
 
    ]; 
 
    
 
    $scope.ChargeOptions = [ 
 
    { Id: 1, Account: 'Account 1' }, 
 
    { Id: 2, Account: 'Account 2' }, 
 
    { Id: 3, Account: 'Account 3' }, 
 
    { Id: 4, Account: 'Account 4' }, 
 
    { Id: 5, Account: 'Account 5' }, 
 
    { Id: 6, Account: 'Account 6' }, 
 
    { Id: 7, Account: 'Account 7' } 
 
    ]; 
 
    
 
    $scope.alertSelected = function(idx) { 
 
    alert($scope.Obligations[idx].ChargeOptionId); 
 
    } 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div ng-app="app" ng-controller="Ctrl"> 
 
    <div ng-repeat="oblig in Obligations"> 
 
    <div> 
 
     ChargeOption.Id = {{ChargeOptions[$index].Id}}/
 
     Obligation.ChargeOptionId = {{oblig.ChargeOptionId}} 
 
    </div> 
 
    <select class="form-control full-width" 
 
      ng-model="oblig.ChargeOptionId" 
 
      ng-options="ch.Id as ch.Account for ch in ChargeOptions"> 
 
    </select> 
 
    <button ng-click="alertSelected($index)">Selected value?</button> 
 
    <br /><br /> 
 
    </div> 
 
</div>

来源

2016-12-05 08:55:24 casraf

ng-model返回值的名称代替实际值

回答

相关问题