javascript - 使用 ng-repeat 指令循环

标签 javascript angularjs

我是 Angular 新手,试图循环遍历数组。当我运行下面的代码时,我没有收到错误,但我没有从数组/属性客户获得任何输出。

<div class="col-sm-4 col-sm-push-4 margin-top-30">
<div class="container"  data-ng-controller="VideoController">

 <input type="text" ng-model="name" /> {{ name }}

<h3>Looping with the ng-repeat Directive</h3>
<ul>
<li data-ng-repeat="cust in customers | filter:name | orderBy:city">{{ cust.name }} - {{ cust.city }}</li>
</ul>
</div>

<script src="scripts/angular.js"></script>

<script>
function VideoController($scope) {
    $scope.customers= [
    {name:'John Smith', city:'Phoenix'},
    {name:'John Doe', city:'San Fransisco'},
    {name:'Test Doe', city:'CPT'}
];
}
</script>


</div>

有人可以指出我的代码出错了吗

最佳答案

如果您还没有 Angular 应用,请将 Angular 应用添加到您的代码中:

var myApp = angular.module('myApp', [])

您需要在 HTML 中使用:

<div ng-app="myApp">

现在,该 div 内的任何内容(您可以将其放置在其他元素上,例如正文上)都将在您的应用程序范围内。如果您想使用 Controller ,并且您使用的 Angular 版本 >= 1.3,则必须将其注册到应用程序:

myApp.controller('VideoController', VideoController);

Fiddle

关于javascript - 使用 ng-repeat 指令循环,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36160269/

相关文章:

javascript - 无法使用 Javascript 删除 no-select 属性

javascript - Google Chrome 插件开发 - 监控网络请求?

javascript - AngularJS $resource 在使用方法 :POST 时调用了错误的 API URL

javascript - 在 for in 循环中更新对象

javascript - 如何将 Angular 功能添加到新添加的 HTML 中?

javascript - 具有相似代码的页面 HTML CSS JS 之间的样式不同

javascript - 如何关闭渐进式网络应用程序

javascript - Typescript 加载模块通过 AMD 失败

javascript - Web Workers 会对 ionic 应用程序有益吗?

javascript - 使用 javascript 填写表单