ANGULARJS implementation in Ng-options Plus index solution _angularjs

This article illustrates the solution of ANGULARJS implementation in Ng-options Plus index. Share to everyone for your reference, specific as follows:

There is a child learning path in ANGULARJS Communication group How to add an index ng-repeat to the ng-options of a angular select like Angularjs $index.

In fact, the angular itself does not provide variables such as $index to use for this problem. But it's not that we don't have a solution for the problem.

To replace this problem with the point of view, we need is the JS array subscript, so if we can add subscript on the object, use the expression as option label can be solved.

But the first impression reminds me of the JS array is a Key/value object, but the key array subscript only, so there are the following design:

Html:

<pre>{{A | json}}</pre>
<select ng-model= "a" ng-options= "Value.field as GETDESC1 (Key,value) for ( Key,value) in T "></select>

Js:

$scope. GETDESC1 = function (key, value) {return
  (parseint (key, ten) + 1) + "->" + Value.field;
};

Unfortunately, if you were to use him as a Key/value object for JavaScript, then key would be unordered, so there was a disorderly subscript as follows:

<select ng-model= "A" ng-options= "L.field as GETDESC1 (Key,value) for (key,value) in T" class= "Ng-valid ng-dirty" >
   <option value= "0" >1->jw_companyTalent</option>
 <option value= "1" >2->jw_ reportgroup</option>
 <option value= "Ten" >11->jw_ads</option>
 <option value= "11" >12->jw_jobcomment</option>
 <option value= "a" >13->jw_companyInfo</option>
 ....
</select>

So this is impossible to solve. Fortunately bloggers also have a trick, ngoptions support Angularjs filter, so we can add an order field on the data source object labeled subscript as the ordinal number. And you can see in the issue of a angular 2 years ago that angular has fix issue,option the array to be generated in subscript order.

Html:

<pre>{{B | json}}</pre>
<select ng-model= "B" ng-options= "L.field as GetDesc (L) for L in T | index" & Gt;</select>

Js:

var app = Angular.module (' Plunker ', []);
App.controller (' Mainctrl ', function ($scope) {
   $scope. T = [{
    field]: ' Jw_companytalent '
   }, {
    field : "Jw_reportgroup"
   }];
   $scope. GetDesc = function (l) {return
    L.order + "->" + L.field;}
). Filter ("Index", [
   function () {return
    function (array)} {return
     (array | []). Map (function (item, index) {
      Item.order = index + 1;
      return item;}
     );
    };

The option is in order to generate, finally we can finally solve the perfect, so this article will also end. At the end of the attached can be operated Demoplnkr ngoptions index;

I hope this article will help you to Angularjs program design.