2015-10-14 4 views
0

Я пытаюсь выяснить, как изменить, какая опция выбрана в меню, на значение.AngularJS: установить выбранную по умолчанию опцию через значение

Пример:

HTML

<div data-ng-app="myApp"> 
    <div data-ng-controller="myController"> 
     <p>n_images = {{n_images}}</p> 
     <select data-ng-model="n_images"> 
      <option data-ng-selected="{{o.value == n_images}}" 
        data-ng-repeat="o in n_images_options" 
        value="{{o.value}}">{{o.text}}</option> 
     </select> 
    </div> 
</div> 

JavaScript

'use strict'; 

var myApp = angular.module('myApp', []); 

myApp.controller('myController', ['$scope', 
    function($scope) { 
     $scope.n_images = 4; 

     $scope.n_images_options = [ 
      {value: 1, text: "1 image"}, 
      {value: 2, text: "2 images"}, 
      {value: 3, text: "3 images"}, 
      {value: 4, text: "4 images"}, 
      {value: 5, text: "5 images"}, 
      {value: 6, text: "6 images"}, 
      {value: 7, text: "7 images"}, 
      {value: 8, text: "8 images"} 
     ]; 
    } 
]); 

Это работает с использованием AngularJS 1.1.5 (JSFiddle example).

Однако, это не работать в новых версиях AngularJS, таких как версия 1.4.6 (JSFiddle example).

Как изменить, какая опция выбрана с помощью значения? Я пытаюсь создать меню выбора, которое будет инициализировано значением строки запроса из URL-адреса.

ответ

1

Для достижения наилучших результатов необходимо использовать ng-options:

<select data-ng-model="n_images" ng-options="o.value as o.text for o in n_images_options"> 
</select> 

https://jsfiddle.net/eywLkdub/

+0

Спасибо! Это сработало, хотя я столкнулся с другой проблемой, которую смог решить, но не понимаю - при использовании $ location.search(), чтобы получить n_images из строки запроса и добавить ее в область $, чтобы выбрать меню выбора правильный вариант, это только работало, если я использовал parseInt() для преобразования n_images для ввода integer (я предполагаю, что это была строка типа). – Bill

+1

Насколько я знаю, вам нужно будет использовать 'ui-router', чтобы вам не нужно было' parseInt': https://github.com/angular-ui/ui-router/wiki/URL прокладка маршрута – sirrocco

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