2015-03-10 4 views
-1

Я пытаюсь предварительно выбрать элемент в списке, который генерируется директивой ng-options. Может кто-нибудь рассказать мне, что происходит в плункер?Предварительно выбрать вариант формы ng-options list

http://plnkr.co/edit/GTnR76HEnB5NxQRe484m?p=preview

<head> 
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script> 
    <script> 
    function MyCntrl($scope) { 
     $scope.prop = { 
     "type": "select", 
     "name": "Service", 
     "values": [{ 
      'name': "Service 1" 
     }, { 
      'name': "Service 2" 
     }, { 
      'name': "Service 3" 
     }, { 
      'name': "Service 4" 
     }] 
     }; 
     $scope.selected1 = $scope.prop.values[1] 
     $scope.selected2 = { 
     "name": "Service 2" 
     } 

    } 
    </script> 
</head> 

<body> 

    <div ng-controller="MyCntrl"> 
    Works <br> 
    <select ng-model="selected1" ng-options="v.name for v in prop.values"> 
    </select> {{selected1}} <br> 
    Does not work. Why? <br> 
    <select ng-model="selected2" ng-options="v.name for v in prop.values"> 
    </select> 
    {{selected2}} 
    </div> 
</body> 
</html> 

ответ

6

заявление Bijay Rai является правильным, но не полный ответ.

ngOption имеет довольно сложные выражения, и вы должны потрудиться, чтобы изучить documentation. Если вы измените способ отслеживания объекта опции, вы можете избежать использования same object по ссылке, как указано. Например, используйте select as шаблон

<select ng-model="selected2" ng-options="v.id as v.name for v in prop.values"> 
</select> 

Тогда вы можете просто присвоить выбранный так:

$scope.selected2 = 3; 

Обновлено plunkr

+1

Спасибо за ответ. Но мне нужен выделенный объект. Я имею в виду, мне нужно '' {'id': 3, 'name': 'Service 3'} '' не просто 3. Как мне это сделать? Кстати, я читал документацию, но ее нелегкий синтаксис для понимания, больше примеров поможет. – Sudhakar

+1

вопрос был «ЧТО происходит», и это ответ. Что делать с этим зависит от вас :) Фактически, когда у вас есть индекс выбранного элемента, вы всегда можете получить его из своего массива. –

+0

Осмотрите это, например [этот вопрос] (http://stackoverflow.com/questions/13916726/angularjs-используя индекс-в-нг-вариантов) –

1
$scope.prop = { 
     "type": "select", 
     "name": "Service", 
     "values": [{ 
      'name': "Service 1" 
     }, { 
      'name': "Service 2" 
     }, { 
      'name': "Service 3" 
     }, { 
      'name': "Service 4" 
     }] 
     }; 

нг-варианты получения данных от prop.values ​​ .... так selected1 работает причина него предопределен, как $ scope.prop.values ​​[1]

тогда selected2 не ссылаясь на данные внутри prop.values ​​ .....

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