Wybrana wartość Angularjs jest niezdefiniowana.

Teraz próbuję uzyskać wartość z rozwijanej listy select, ale ona zwraca wartość undefined. Rzecz jest w poziomie html To działa jak oczekujemy, Oto mój kod:Wybrana wartość Angularjs jest niezdefiniowana.

<div class='subcontent'>    
    <input id="me" type="radio" class='choosemethod' ng-model="paymentmethod" value="Y"><label for="me" class='choosemethod'>Me</label> 
    <input id="company" type="radio" ng-model="paymentmethod" value="N" class='choosemethod'><label for="company" class='choosemethod'>My Company</label><br/> 
    <span class='helptext'>Who makes payments to this account?</span><span class='help' style='margin-left:20px;width:20px;height:20px;'>help</span> 
</div> 

<div class='paymentmethods subcontent' ng-switch on="paymentmethod"> 
    <select ng-model='selectedmethod' ng-init="selectedmethod=Memethods[0]" id='methods' ng-switch-when='Y'> 
    <option ng-repeat="method in Memethods" value="{{method}}">{{method}}</option> 
    </select> 

    <select ng-model='selectedmethod' ng-init="selectedmethod=companies[0]" ng-switch-when='N' style='float:left'> 
    <option ng-repeat='companyoption in companies' value="{{companyoption}}">{{companyoption}}</option> 
    </select> 

    <div class='clear'></div> 
    <label for ='methods'>Payment Method</label><span class='help' style='margin-left:20px;width:20px;height:20px;'>help</span> 
</div>

w JS:

$scope.Memethods = ['Same as Card/Account Name','American Express','American Express Corp','Cash','Checking','MasterCard','My Visa','VISA']; 
$scope.companies = ['Company Paid','MyAMEX'];

to widać dobrze w strony, ale gdy próbuję uzyskać wartość, to pokazuje niezdefiniowany. dowolny pomysł?

Źródło

2015-02-24 linyuanxie

Czy zajmowałeś się konfiguracją wybranych opcji za pomocą dyrektywy ng-options? Wtedy nie musisz sam generować znaczników opcji i ma on również inne zalety. Stwierdziłem, że jest łatwiej, niż się spodziewałem, gdy tylko spróbowałem. Dokumenty mogą wyjaśnić to znacznie lepiej niż ja: https://docs.angularjs.org/api/ng/directive/ngOptions –

Jest to klasyczny "kanciasty notacja kropka" problem.

Here is a working example

Zasadniczo ng-switch tworzy nowy zakres, więc kiedy wybierz ustawia właściwość selectedmethod, robi to na nowym zakresie, nie zakres kontrolera jak oczekujesz. Jednym z rozwiązań jest utworzenie obiektu nadrzędnego dla twojego modelu.

angular.module('app',[]) 
.controller('main', function($scope){ 
    $scope.selection = {}; 
    $scope.Memethods = ['Same as Card/Account Name','American Express','American Express Corp','Cash','Checking','MasterCard','My Visa','VISA']; 
    $scope.companies = ['Company Paid','MyAMEX']; 
})

i zauważ, jak to się odnosi inaczej w HTML:

<select ng-model='selection.selectedmethod' ng-init="selection.selectedmethod=companies[0]" ng-switch-when='N' style='float:left'> 
    <option ng-repeat='companyoption in companies' value="{{companyoption}}">{{companyoption}}</option> 
</select>

inny (może lepiej) sposobem byłoby użyć „ControllerAs” składnię, która ma wpływ robi to za Ciebie .

angular.module('app',[]) 
    .controller('main', function($scope){ 

     this.Memethods = ['Same as Card/Account Name','American Express','American Express Corp','Cash','Checking','MasterCard','My Visa','VISA']; 
     this.companies = ['Company Paid','MyAMEX']; 
    }) 

<body ng-app="app" ng-controller="main as main"> 
    <div class='subcontent'> 
    <input id="me" type="radio" class='choosemethod' ng-model="paymentmethod" value="Y"> 
    <label for="me" class='choosemethod'>Me</label> 
    <input id="company" type="radio" ng-model="paymentmethod" value="N" class='choosemethod'> 
    <label for="company" class='choosemethod'>My Company</label> 
    <br/> 
    <span class='helptext'>Who makes payments to this account?</span><span class='help' style='margin-left:20px;width:20px;height:20px;'>help</span> 
    </div> 

    <div class='paymentmethods subcontent' ng-switch on="paymentmethod"> 
    <select ng-model='main.selectedmethod' ng-init="main.selectedmethod=main.Memethods[0]" id='methods' ng-switch-when='Y'> 
     <option ng-repeat="method in main.Memethods" value="{{method}}">{{method}}</option> 
    </select> 

    <select ng-model='main.selectedmethod' ng-init="main.selectedmethod=main.companies[0]" ng-switch-when='N' style='float:left'> 
     <option ng-repeat='companyoption in main.companies' value="{{companyoption}}">{{companyoption}}</option> 
    </select> 

    <div class='clear'></div> 
    <label for='methods'>Payment Method</label><span class='help' style='margin-left:20px;width:20px;height:20px;'>help</span> 

    </div> 
    <div>{{main.selectedmethod}}</div> 
</body>

Źródło

2015-02-24 18:45:35

To jest to, czego potrzebuję, myślałem, że może to być problem z zasięgiem, ale nie wiedziałem, gdzie i czemu. Dzięki! – linyuanxie

Dobrze wyjaśnione, chociaż uważam, że twój przykład kodu dla składni "kontroler jako" nie jest w 100% poprawny - nie musisz zmieniać pozostałych odniesień do 'Memethods' i' firm' na 'main.Memethods'/'main.companies'? Wszystko, co jest własnością instancji kontrolera, jest dostępne tylko w zakresie za pośrednictwem właściwości scope, która w tym przypadku jest "główna". – GregL

To jest to, co otrzymuję za złożenie razem odpowiedzi na iPadzie. Edytowane. Dzięki –

można odnieść się do tej prostej example

kodu html:

<div ng-controller="Main" ng-app> 
    <div>selections = {{selections}}</div> 

    <div> 
     <p>Model doesn't get updated when selecting:</p> 
     <select ng-repeat="selection in selections" ng-model="selection" ng-options="i.id as i.name for i in items"> 
     <option value=""></option> 
     </select> 
    </div>

js kod:

function Main($scope) { 

    $scope.selections = ["", "id-2", ""]; 

    $scope.reset = function() { 
     $scope.selections = ["", "", ""]; 
    }; 

    $scope.sample = function() { 
     $scope.selections = [ "id-1", "id-2", "id-3" ]; 
    } 

    $scope.items = [{ 
     id: 'id-1', 
     name: 'Name 1'}, 
    { 
     id: 'id-2', 
     name: 'Name 2'}, 
    { 
     id: 'id-3', 
     name: 'Name 3'}]; 
}

Źródło

2015-02-24 18:31:54 TechnoCrat

Wewnętrzna wartość modelu ng musi mieć wartość Initialize przed oznaczeniem. Tak więc ng-init pojawia się przed modelem ng. wewnątrz opcji $ pierwszy służy do wyboru pierwszej wartości.

<select ng-init= "selectedmethod=companies[0]" ng-model='selectedmethod' ng-switch-when='N' style='float:left'> 
    <option ng-repeat='companyoption in companies' value="{{companyoption}}" ng-selected="$first">{{companyoption}} 
    </option> 
</select>

Źródło

2015-12-12 19:06:32 Anbarasan

Wybrana wartość Angularjs jest niezdefiniowana.

Odpowiedz

Powiązane problemy