2014-11-10 2 views
-1

В документах AngularJS они ссылаются на this fiddle, из которых я вывел простой jsfiddle here.AngularJS не заселяющий или инициализирующий выбор

Весь HTML:

<body ng-app="demoApp"> 
<div ng-controller="demoController"> 
<table> 
    <tr> 
    <td>Select Category 
     <select ng-model="selectedCategory" 
       ng-options="cat as cat for cat in categories"> 
     </select> 
    </td> 
    The category selected is: {{selectedCategory}} 
    </tr> 
    <tr> 
    <td>Select CategoryId 
     <select ng-model="selectedCatId" 
       ng-options="ds as ds.id for ds in dataset"> 
     </select> 
     The category id selected is: {{selectedCatId}} 
    </td> 
    </tr> 
</table> 
</div> 
</body> 

Контроллер AngularJS:

angular.module('demoApp', []).controller('demoController', function($scope) { 
    $scope.categories = ["CAT1", "CAT2", "CAT3"]; 
    $scope.dataset = [ 
        { "category": "CAT1", "id": "CAT_ID11" }, 
        { "category": "CAT1", "id": "CAT_ID12" } 
        ]; 

    $scope.selectedCategory = categories[1]; 
    $scope.selectedCatId = $scope.dataset[1]; 
}); 

В результате я вижу в скрипкой:

enter image description here

Кроме того, не видя инициализации , Я тоже не вижу элементы списка, и я не су почему. Что мне не хватает?

+1

Отправьте код как текст, а не как изображения. В противном случае нам нужно снова ввести его полностью, чтобы показать, как его исправить. И откройте консоль своего браузера: вы увидите это сообщение об ошибке: «ReferenceError: categories not defined». –

+0

Хороший отзыв о кодексе: с фактическим кодом. Только скрипка как упрощение фактического кода и пропущенная обратная связь с браузером –

ответ

1

Категории не определены. Golbal Декларация-

var categories=["CAT1", "CAT2", "CAT3"]; 

Также категории является массивом, поэтому,

<select ng-model="selectedCategory" 
       ng-options="cat for cat in categories"> 
     </select> 

Проверить это fiddle-

http://jsfiddle.net/RahulB007/0a1xbxm2/2/

+0

Проблема с категориями была проблемой. «Кошка как кошка для кошек в категориях» по-прежнему работает в моей переработанной скрипке, но ваша версия вернее. –

+0

Вероятно, нужно добавить 'track by $ index' к этому. Это улучшит производительность вашего приложения. – dball

0

В вашей скрипке у вас есть рабочий и нерабочий версия.

Причина, по которой один не работает, заключается в том, что угловой проверяет, являются ли они одним и тем же объектом, а не если значения объекта одинаковы.

Выберите объект на объекте (как правило, уникальный идентификатор) и укажите его через track by.

Делая это разметку бы от этого:

ng-options="opt as opt.label for opt in options"> 

к этому:

ng-options="opt as opt.label for opt in options track by opt.value"> 

Here is your fiddle updated with my working addition

1

Вы упускаете $scope для вашей категории, так что шаблон делает не имеют доступа к его стоимости.

Просто сделать что-то вроде:

$scope.selectedCategory = $scope.categories[1]; 

Вот скрипка: http://jsfiddle.net/gleezer/0a1xbxm2/3/

1

Если открыть средства разработки консоли в браузере, вы увидите следующее сообщение об ошибке:

ReferenceError: categories is not defined

Это означает, что ваш код пытается получить доступ к переменной, которая не определена.И в самом деле:

$scope.selectedCategory = categories[1]; 

должен быть

$scope.selectedCategory = $scope.categories[1]; 

В процессе разработки, всегда оставляйте консоль открыта.

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