Nur Wert für Auswahl in Angular erhalten

Nicht sicher, was ich hier falsch mache. Ich möchte den Wert des Monatsselektors (zB 2). Was ich bekomme istNur Wert für Auswahl in Angular erhalten

{val: 2, name: 'Feb'}

hier meiner Ansicht nach mit dem Monat Selektor ist:

<div class="form-group"> 
    <label class="control-label col-md-3">Expiry Month</label> 
    <div class="col-md-9"> 
     <select ng-model="cartModalVm.creditCard.CardExpiryMonth" 
       ng-options="month.name for month in cartModalVm.months track by month.val" 
       name="cardExpiryMonth" 
       class="form-control input-inline input-medium" 
       required> 
      <option value="">Month</option> 
     </select> 
    </div> 
</div>

Hier ist, wie sie in meinem Controller gesetzt sind:

vm.months = [ 
    { val: 1, name: 'January' }, 
    { val: 2, name: 'February' }, 
    { val: 3, name: 'March' }, 
    { val: 4, name: 'April' }, 
    { val: 5, name: 'May' }, 
    { val: 6, name: 'June' }, 
    { val: 7, name: 'July' }, 
    { val: 8, name: 'August' }, 
    { val: 9, name: 'September' }, 
    { val: 10, name: 'October' }, 
    { val: 11, name: 'November' }, 
    { val: 12, name: 'December' }

Ich glaube, ich nicht wirklich brauchen val Eigenschaft in meinem Objekt, ich kann einfach $ Index verwenden, aber das wird das Problem nicht lösen. Worauf weise ich das Modell hin, um einfach '2' zu bekommen?

Das ist für jetzt funktioniert, aber es saugt:

vm.creditCard.CardExpiryMonth = vm.creditCard.CardExpiryMonth.val;

Quelle

2016-08-07 DaveC426913

ändern ngOptions zu:

ng-options="month.val as month.name for month in cartModalVm.months"

(function() { 
 
    'use strict'; 
 

 
    angular 
 
    .module('app', []) 
 
    .controller('MainCtrl', MainCtrl); 
 

 
    function MainCtrl() { 
 
    var vm = this; 
 
    vm.months = [ 
 
     { val: 1, name: 'January' }, 
 
     { val: 2, name: 'February' }, 
 
     { val: 3, name: 'March' }, 
 
     { val: 4, name: 'April' }, 
 
     { val: 5, name: 'May' }, 
 
     { val: 6, name: 'June' }, 
 
     { val: 7, name: 'July' }, 
 
     { val: 8, name: 'August' }, 
 
     { val: 9, name: 'September' }, 
 
     { val: 10, name: 'October' }, 
 
     { val: 11, name: 'November' }, 
 
     { val: 12, name: 'December' } 
 
    ]; 
 
    } 
 
})();

<!DOCTYPE HTML> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.8/angular.min.js"></script> 
 
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.min.css"> 
 
</head> 
 

 
<body ng-controller="MainCtrl as cartModalVm"> 
 
    <div class="form-group"> 
 
    <label class="control-label col-md-3">Expiry Month</label> 
 
    <div class="col-md-9"> 
 
     <select ng-model="cartModalVm.creditCard.CardExpiryMonth" ng-options="month.val as month.name for month in cartModalVm.months" name="cardExpiryMonth" class="form-control input-inline input-medium" required> 
 
     <option value label="Month" hidden></option> 
 
     </select> 
 
     <hr> 
 
     Selected month: <pre ng-bind="cartModalVm.creditCard.CardExpiryMonth"></pre> 
 
    </div> 
 
    </div> 
 
</body> 
 

 
</html>

Quelle

2016-08-07 23:31:25 developer033

Dank! Ich bin sicher, eines Tages werde ich in der Lage sein, diese Logik zu entschlüsseln ... – DaveC426913

Nur Wert für Auswahl in Angular erhalten

Antwort

Verwandte Themen