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返回值的名稱代替實際值

回答

相關問題