NGモデルは、私はどの新しく作成された<code>TestExpense</code>オブジェクトが機能<code>submitExpenses</code>を介してプッシュするために一時的なJavaScriptオブジェクト<code>currentExpense</code>、オブジェクトコンストラクタ<code>TestExpense</code>、およびアレイ<code>TestExpenses</code>と角度コントローラを有するアレイ

Question

にJavaScriptオブジェクトのプロパティを設定されています。次のようにこれらのコードは次のように私の見解でng-modelの

$scope.currentExpense = { 
     employeeId: 9, 
     date: '', 
     account: '', 
     task: '', 
     expenseType: '', 
     expenseCategory: '', 
     notes: '', 
     amount: '' 
    }; 

function TestExpense(employeeId, date, account, task, expenseType, 
            expenseCategory, notes, amount) { 
    this.employeeId = employeeId; 
    this.date = date; 
    this.account = account; 
    this.task = task; 
    this.expenseType = expenseType; 
    this.expenseCategory = expenseCategory; 
    this.notes = notes; 
    this.amount = amount; 
} 

$scope.TestExpenses = []; 

$scope.submitExpenses = function() { 
    $scope.TestExpenses = []; 
    $scope.TestExpenses.push(
     new TestExpense(
     $scope.currentExpense.employeeId, 
     $scope.currentExpense.date, 
     $scope.currentExpense.account, 
     $scope.currentExpense.task, 
     $scope.currentExpense.expenseType, 
     $scope.currentExpense.expenseCategory, 
     $scope.currentExpense.notes, 
     $scope.currentExpense.amount 
     ) 
    ); 
    console.log($scope.TestExpenses); 
}; 

一つの使用法は次のとおりです。

<select multiple="" class="form-control" ng-model="currentExpense.expenseType" 
ng-options="task.expenseTypeId as task.expenseTypeTitle for task in ExpenseTypes" required> 
    </select> 

そして、ここでは関係ExpenseTypeコンストラクタとExpenseTypes配列です：

function ExpenseType(expenseTypeId, expenseTypeTitle) { 
    this.expenseTypeId = expenseTypeId; 
    this.expenseTypeTitle = expenseTypeTitle; 
} 

$scope.ExpenseTypes = []; 

私の問題は、配列TestExpensesのオブジェクトをログに記録すると、私はexpenseTypeプロの配列を見ているperty：

TestExpense 
account:"a" 
amount:"" 
date:"" 
employeeId:9 
expenseCategory: Array[1] 
    0: 2 
    length:1 
__proto__:Array[0] 
expenseType:Array[1] 
    0:4 
    length:1 
__proto__:Array[0] 
notes:"" 

私の目標は、expenseTypeプロパティは、単に4の代わりに、それが現在に設定されている配列であることです。

これを達成するためのアドバイスは大歓迎です！

Answer 1

ここに問題があります。セレクトで1つ以上の項目を選択できます。それで、それはexpenseTypeのより多くの項目を押すでしょう。

しかし、あなたはここに

var expenseType = $scope.currentExpense.expenseType.length === 1 ? $scope.currentExpense.expenseType[0] : $scope.currentExpense.expenseType; 

いくつかのロジックを追加して、あなたのコンストラクタにexpenseTypeを渡すことができますつの項目について、

angular.module('myApp',[]).controller('MyCtrl', ['$scope', function($scope){ 
 
    
 
$scope.currentExpense = { 
 
     employeeId: 9, 
 
     date: '', 
 
     account: '', 
 
     task: '', 
 
     expenseType: '', 
 
     expenseCategory: '', 
 
     notes: '', 
 
     amount: '' 
 
    }; 
 
    
 
    $scope.TestExpenses = []; 
 
    
 
    $scope.ExpenseTypes = [ 
 
    new ExpenseType(1, 'First'), 
 
    new ExpenseType(2, 'Second'), 
 
    new ExpenseType(3, 'Third'), 
 
    ]; 
 

 
$scope.submitExpenses = function() { 
 
    
 
    var expenseType = $scope.currentExpense.expenseType.length === 1 ? $scope.currentExpense.expenseType[0] : $scope.currentExpense.expenseType; 
 
    
 
    $scope.TestExpenses.push(
 
     new TestExpense(
 
     $scope.currentExpense.employeeId, 
 
     $scope.currentExpense.date, 
 
     $scope.currentExpense.account, 
 
     $scope.currentExpense.task, 
 
     expenseType, 
 
     $scope.currentExpense.expenseCategory, 
 
     $scope.currentExpense.notes, 
 
     $scope.currentExpense.amount 
 
     ) 
 
    ); 
 
    console.log($scope.TestExpenses); 
 
}; 
 
    
 
    
 

 
}]) 
 

 
function TestExpense(employeeId, date, account, task, expenseType, 
 
            expenseCategory, notes, amount) { 
 
    this.employeeId = employeeId; 
 
    this.date = date; 
 
    this.account = account; 
 
    this.task = task; 
 
    this.expenseType = expenseType; 
 
    this.expenseCategory = expenseCategory; 
 
    this.notes = notes; 
 
    this.amount = amount; 
 
} 
 

 
function ExpenseType(expenseTypeId, expenseTypeTitle) { 
 
    this.expenseTypeId = expenseTypeId; 
 
    this.expenseTypeTitle = expenseTypeTitle; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app='myApp' ng-controller='MyCtrl'> 
 
    <select multiple="" class="form-control" ng-model="currentExpense.expenseType" ng-click='submitExpenses()' size='3' 
 
ng-options="task.expenseTypeId as task.expenseTypeTitle for task in ExpenseTypes" required> 
 
    </select> 
 
    </div>