ng-init не устанавливает категорию по умолчанию для выбора в приложении Angular

Question

ng-init не устанавливает категорию по умолчанию для выбора в приложении Angular

0

У меня есть такая же проблема, как упоминалось здесь: Как установить параметр по умолчанию в поле выбора Angular.js

Однако ни один из ответов не устраняет мою проблему ниже, я пытаюсь отобразить первую категорию внутри выбранного:

<p>Choose a tag category:</p>
<div class="select-style">
    <select ng-model="modal.addedTag" ng-init="modal.addedTag = modal.categories[0].name" ng-options="category.name for category in modal.categories">
        <!-- <option value="brand" selected>Brand</option> 
        <option value="client">Client</option>
        <option value="company-name">Company Name</option>
        <option value="government">Government</option>
        <option value="events">Events</option>
        <option value="industry">Industry</option>
        <option value="products">Products</option>
        <option value="news">News</option> -->
    </select>
</div>

Модель в моем контроллере:

var vm = this;
vm.categories = [
    { name: 'brand' },
    { name: 'client' },
    { name: 'competitor-name' },
    { name: 'company-name' },
    { name: 'government' },
    { name: 'events' },
    { name: 'industry' },
    { name: 'people' },
    { name: 'philanthropic' },
    { name: 'products' },
    { name: 'product-category' },
    { name: 'product-feature' },
    { name: 'place' },
    { name: 'problem' },
    { name: 'news' },
    { name: 'related-company-name' },
    { name: 'trend' }
];

Leon Gaban 01 апр. 2016, в 22:22

Источник

0

Может потому что варианты закомментированы?
Chrillewoodz 01 апр. 2016, в 19:28
0

Предполагается, что ng-options действует так же, как ng-repeat Я просто исправил эту проблему, установив ng-model по умолчанию.
Leon Gaban 01 апр. 2016, в 19:31
0

Стоит отметить, что это неправильное использование ng-init, согласно документации. Это легко может быть (и должно быть) сделано в контроллере.
David L 01 апр. 2016, в 19:32
0

вы используете modal.categories[0].name но вы объявили переменную categories в vm ?
Tjaart van der Walt 01 апр. 2016, в 19:33
0

модал был syntax as директивы syntax as ключевое слово, я не использую $ scope
Leon Gaban 01 апр. 2016, в 22:51

Показать ещё 3 комментария

Теги:

javascript

angularjs

drop-down-menu

angularjs-ng-init

2 ответа

1

можно попробовать инициализировать vm.addedTag из controller вместо DOM

vm.addedTag = vm.categories[0].name; // after your categories array

и в html использовать только ng-model не нужно использовать ng-init и использовать category.name as category.name

<select ng-model="modal.addedTag" ng-options="category.name as category.name for category in modal.categories"></select>

Shaishab Roy 01 апр. 2016, в 18:26

Ещё вопросы

Может потому что варианты закомментированы?
Предполагается, что ng-options действует так же, как ng-repeat Я просто исправил эту проблему, установив ng-model по умолчанию.
Стоит отметить, что это неправильное использование ng-init, согласно документации. Это легко может быть (и должно быть) сделано в контроллере.
вы используете modal.categories[0].name но вы объявили переменную categories в vm ?
модал был syntax as директивы syntax as ключевое слово, я не использую $ scope

Hadi J · Accepted Answer · 2016-04-01T17-00-00.000Z

попробуйте это в контроллере.

если вы используете ng-options="category.name for category in modal.categories" выберите тег, затем init vm.addedTag = vm.categories[0]; в контроллере. а также используйте ng-options="category.name as category.name for category in modal.categories" в теге select, а затем init vm.addedTag, как это vm.addedTag = vm.categories[0].name;

var myapp = angular.module('app', []);
myapp.controller('Main', function ($scope) {
 var vm = this;
vm.categories = [
    { name: 'brand' },
    { name: 'client' },
    { name: 'competitor-name' },
    { name: 'company-name' },
    { name: 'government' },
    { name: 'events' },
    { name: 'industry' },
    { name: 'people' },
    { name: 'philanthropic' },
    { name: 'products' },
    { name: 'product-category' },
    { name: 'product-feature' },
    { name: 'place' },
    { name: 'problem' },
    { name: 'news' },
    { name: 'related-company-name' },
    { name: 'trend' }
];
  vm.addedTag = vm.categories[0];
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app = "app">
  <div ng-controller="Main as modal">

<div class="select-style">
    <select ng-model="modal.addedTag"  ng-options="category.name for category in modal.categories">
       
    </select>
</div>
   </div>
</div>