我如何在我的HTML代码中为此写入ng-repeat

时间:2016-09-12 18:19:45

标签: angularjs

for(var i=0;i<a.length;i++){
$scope.inputs=[
{name:a[i],value:b[i]} 
];

}

这是我的Javascript代码,我想知道如何为数组编写(ng-repeat)

3 个答案:

答案 0 :(得分:1)

您不会编写围绕全局变量的循环。您自己保留变量,然后调用循环。稍后您只需在html代码中使用全局变量。

我制作了一个很酷的片段,让您了解它的工作原理:

angular.module('demo', [])

.controller('Ctrl', ['$scope', function ($scope) {
  $scope.inputs = [];

  var a = ['name1', 'name2', 'name3']; 
  var b = [133,233,456];

  //this code has to be called somewhere else. It might be part of a function.
  for(var i=0; i < a.length; i++){
    $scope.inputs.push( {name:a[i],value:b[i]} );
  }
  
}])
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="demo">
    <div ng-controller="Ctrl">
        <ul>
            <li ng-repeat="item in inputs">
                <input ng-model="item.name"/>
            </li>
        </ul>
        
        <!--This is only to display the content of $scope.inputs -->
        <pre>{{inputs | json}}</pre>
    </div>
</div>

答案 1 :(得分:1)

你的JS无效,会生成长度为1的数组。替换为:

$scope.inputs=[];
for(var i=0;i<a.length;i++){// be sure that a.length >=b.length
   $scope.inputs.push({name:a[i],value:b[i]}); // push will add new entry to your inputs array.
}

你可以在ng-repeat中使用它:

<div ng-repeat="entry in inputs"> {{entry.name}} : {{entry.value}} </div>

答案 2 :(得分:0)

如果您的控制器中有一个数组,其范围在您的html中可见

angular.module('appName').controller('mainCtrl', mainCtrl);

function mainCtrl($scope) {
    $scope.inputs = [
        key: value,
        ...
    ];
}

在你的html中,你将在控制器的范围内使用ng-repeat。您可以在几个不同的html标记上使用ng-repeat指令,例如<ul>列表,div,选择下拉菜单等

<div ng-controller="mainCtrl">
     <ul>
          <li ng-repeat="item in inputs">{{item.key}} <!-- Prints 'value' --></li>
     </ul>
</div>