Good day! Studying Angular came across one problem. Here is a small form

<div class="form-container" ng-controller="formCtrl"> <form> <select id="file-type" ng-model="type" ng-options="type as type.type for type in data.types"></select> <input type="text" id="file-name" ng-model="name"> <select id="file-classification" ng-model="classification" ng-options="classification.id as classification.type in data.classifications"></select> </form> <br/> <p>File type: {{type.type}}</p> <p>File name: {{name}}</p> <p>File classification: {{classification.type}}</p> </div>

This example for the first two fields works, but does not see the third. What is the mistake there?

Here is the angular code itself:

 var app = angular.module('main', []); function Obj(id,type){ this.id = id; this.type = type; } app.controller('formCtrl', function($scope) { $scope.data = { types: [new Obj(1,"type-1"),new Obj(2,"type-2")], classifications: [ new Obj(1, "CS-1"), new Obj(2, "CS-2"), new Obj(3, "CS-3"), new Obj(4, "CS-4") ] } });

    1 answer 1

    Found what the problem was: Syntax error

    In the second <select> element

    ng-options="classification.id as classification.type in data.classifications"

    I forgot to register for classification in data.classifications

    And it completely turns out

     ng-options="classification.id as classification.type for classification in data.classifications"`

    That's what came out of it.

     var app = angular.module('main', []); function Obj(id, type) { this.id = id; this.type = type; } app.controller('formCtrl', function($scope) { $scope.data = { types: [new Obj(1, "Type-1"), new Obj(2, "Type-2")], classifications: [new Obj(1, "CS-1"), new Obj(2, "CS-2"), new Obj(3, "CS-3"), new Obj(4, "CS-4")] } }); 
     <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="main"> <div class="form-container" ng-controller="formCtrl"> <form> <select id="file-type" ng-model="type" ng-options="type as type.type for type in data.types"></select> <input type="text" id="file-name" ng-model="name"> <select id="file-classification" ng-model="classification" ng-options="classification as classification.type for classification in data.classifications"></select> </form> <br/> <p>File type: {{type.type}}</p> <p>File name: {{name}}</p> <p>File classification: {{classification.type}}</p> </div> </div>