2016-02-25 3 views
1

Начало работы с Angular, и у меня проблема с привязкой модели к работе для опции выбора в шаблоне.Значение модели Angular - ngOptions не обновляется

У меня есть следующие нг-варианты выбора в шаблон:

<select ng-model="listenercount" ng-options="n for n in [] | range:0:1000" ng-change="listenersUpdate()"></select> 

У меня есть фильтр, который выглядит следующим образом:

angular.module('myapp').filter('range', function() { 
    return function(input, min, max) { 
     min = parseInt(min); 
     max = parseInt(max); 
     for (var i=min; i<max; i++) { 
      input.push(i); 
     } 
     return input; 
    }; 
}); 

Мой выбор отображается корректно с параметрами 0-1000 на основе мой фильтр.

В мой контроллер у меня есть следующие:

$scope.listenercount = 0; 

$scope.listenersUpdate = function() { 
    alert('new listener count is now:' + $scope.listenercount); 
} 

Мое предупредительное сообщение появляется каждый раз, когда я изменить выбор, как и ожидалось, но это всегда показывает $ scope.listenercount = 0. $ модель scope.listenercount привязка, похоже, не обновляет значение.

Все, что я вижу, я делаю неправильно?

+0

Есть ли у вас какие-либо ошибки в консоли браузера? – csharpfolk

+0

Хороший вопрос .. ошибок в javascript-консоли браузера нет. –

+0

Не могли бы вы разместить весь код контроллера? – csharpfolk

ответ

0

<body ng-app="myapp"> 
 
    <script> 
 
    angular.module('myapp', []) 
 
    .controller('ExampleController', ['$scope', function($scope) { 
 
     $scope.listenercount = 0; 
 

 
$scope.listenersUpdate = function() { 
 
    alert('new listener count is now:' + $scope.listenercount); 
 
} 
 

 
    }]); 
 
    angular.module('myapp').filter('range', function() { 
 
    return function(input, min, max) { 
 
     min = parseInt(min); 
 
     max = parseInt(max); 
 
     for (var i=min; i<max; i++) { 
 
      input.push(i); 
 
     } 
 
     return input; 
 
    }; 
 
}); 
 
</script> 
 
<div ng-controller="ExampleController"> 
 
    <select ng-model="listenercount" ng-options="n for n in [] | range:0:1000" ng-change="listenersUpdate()"></select> 
 

 
    <tt>debug = {{confirmed}}</tt><br/> 
 
    <tt>counter = {{counter}}</tt><br/> 
 
</div> 
 
</body>

Это работает, как ожидалось

+0

Хмм .. Когда я использую {{listenercount}} для отображения выбранного значения в моем шаблоне, страница обновляется в моем браузере всякий раз, когда я меняю значение выбора. Мой контроллер, однако, по-прежнему показывает $ scope.listenercount как 0. Я изменил свой контроллер, чтобы использовать console.log вместо предупреждения по другому предложению, которое ничего не меняло. –

+1

@John Я предполагаю, что ваш выбор и ваш {{listenercount}} находятся внутри ng-if или ng-repeat или любой директивы, создающей собственную область. Опубликовать plunkr, воспроизводя ошибку –

+0

Я добавил таймер setInterval для вывода my $ scope.listenercount в console.log, и он никогда не изменяется. Независимо от того, что я меняю выбор. Должно быть что-то с моей ng-model = 'x', не связанным с $ scope.x по какой-то причине синтаксиса. нет ?? –

Смежные вопросы