angular ng-repeat

in angular 1.3.0 u have to do like below, Because Global controllers were disabled in 1.3.0-beta.reference

<div id="tableAFS" ng-app="myApp" ng-controller="personController">
<table class="allDiv" ng-repeat="item in items">

<td>{{$index + 1}}</td>
<td>{{item.name}}</td>
<td>{{item.price | currency}}</td>
<td><input ng-model="item.quantity"></td>
<td>{{item.quantity * item.price | currency}}</td>
<td>
<button ng-click="remove($index)">Remove</button>
</td>

</table>

<script>
var app = angular.module("myApp",[]);

app.controller(‘personController‘, function($scope){
$scope.firstName = "David";

$scope.lastName = "Silva";

$scope.items = [

{ name: "雷柏(Rapoo) V500 机械游戏键盘 机械黄轴", quantity: 1, price: 199.00 },
{ name: "雷柏(Rapoo) V20 光学游戏鼠标 黑色烈焰版", quantity: 1, price: 139.00 },
{ name: "AngularJS权威教程", quantity: 2, price: 84.20 }
];

})
</script>

It also said that you can get the older behavior by using below code , but its not recomended

<div ng-app="myApp" ng-controller="personController">

var app = angular.module("myApp",[]).config([‘$controllerProvider‘, function($controllerProvider) {
$controllerProvider.allowGlobals();
}]);

function personController($scope) {
$scope.firstName = "David";
$scope.lastName = "Silva";
}

时间: 2024-10-27 07:42:38

angular ng-repeat的相关文章

angular ng build 报错 Cannot read property &#39;default&#39; of undefined

95% emitting index-html-webpack-plugin Cannot read property 'default' of undefinedTypeError: Cannot read property 'default' of undefined at compiler.hooks.emit.tapPromise (E:\projects\node_modules\@angular-devkit\build-angular\src\angular-cli-files\p

Part 6 AngularJS ng repeat directive

ng-repeat is similar to foreach loop in C#. Let us understand this with an example. Here is what we want to do. 1. For each employee we have in the employees array we want a table row. With in each cell of the table row we to display employee Firstna

angular ng指令

1.指令 ng-app,ng- 都是angular的指令系统ng-app: ng-app是angular的初始化,一个页面只能有一个ng-app,位置不限制.在页面上加入了这个执行,那么从当前的元素以及儿子元素,都交给angular管理,不赋值的话,会有一个默认模块.ng-app="myApp"这里如果加了自定义的名字,那么必须创建对应的模块.ng-model:双向绑定数据 ng-init:给字段赋予初始值.ng-init="val=0". ng-bind:单向绑定

Angular入门

Angular入门 这个系列一共会涉及两个JavaScript框架的讲解,一个是Express用做后端,一个是Angular用于前端.和Express一样,Angular分离内容,处理视图.数据和逻辑.和MVC模式很相似,但其实Angular定义是MVW框架,W代表(what ever works for you).意味着它可以是控制器或者视图模型,或者服务,就看你怎么定义的.这一节会介绍基本的Angular知识:然后改造我们之前做的页面:并且调用之前的定义的api来获取数据. Angular的

Nodejs之MEAN栈开发(五)-- Angular入门与页面改造

这个系列一共会涉及两个JavaScript框架的讲解,一个是Express用做后端,一个是Angular用于前端.和Express一样,Angular分离内容,处理视图.数据和逻辑.和MVC模式很相似,但其实Angular定义是MVW框架,W代表(what ever works for you).意味着它可以是控制器或者视图模型,或者服务,就看你怎么定义的.这一节会介绍基本的Angular知识:然后改造我们之前做的页面:并且调用之前的定义的api来获取数据. Angular的数据绑定是指视图的改

angular和vue的对比,几个总结:

首先都是双向数据绑定,前后分离的武器之一,不同点,ng庞大,功能更复杂,有时候用在手机端可能不是很好,而vue就是迷你版的angular,好比,jq和zepto的区别 1.controller,对应到vue里面就是new Vue({el:}),这个el,页面上,ng需要写控制器名字,vue不需要, 2.ng自带http服务,vue没有,需要下载vue-resource,当然这个也不大,就12k左右: 3.ng的指令,对应vue的组件,不理解的可以认为是jq的插件,区别是ng是directive,

Node.js开发入门—引入UIBootstrap

很多Web管理系统的侧边菜单是可折叠的(手风琴样式),我们在前面两篇文章里的HTML模板,自己用div.css做了一些处理,可效果不好.所以我请来了一个前端UI框架,UI Bootstrap,来帮忙.别看它名字里带一个Bootstrap,但它并不依赖Bootstrap,而是用AngularJS实现的原生指令哦.我讨厌太多的依赖,这个我喜欢. 这篇我们以"Angular简单示例"里的AngularDemo为基础,我说到的目录什么的,都遵循express应用的默认目录结构. UI Boot

[译]用AngularJS构建大型ASP.NET单页应用(三)

原文地址:http://www.codeproject.com/Articles/808213/Developing-a-Large-Scale-Application-with-a-Single AngularUI 下面的示例中使用了AngularUI的各种UI组件.AngularUI 是AngularJS 框架的一个辅助套件.示例中使用的主要组件大部分来在AngularUI 的一个子集UI Bootstrap.UI Bootstrap是从Twitter Bootstrap派生出来的,它使用A

abp+angular2 导航栏添加菜单

理清思路,记录以备忘. XPName:项目名称 XEName:菜单名称 X:\XPName\angular>:命令行路径 第一步: XPName.AngularUI/src/shared/layout/topbar.component.ts文件内添加 menuItems: MenuItem[] = [       ...        new MenuItem("XEName", "", "fa fa-calendar-o", "

table sorting&ndash;angularjs

1: <script type="text/javascript" ng:autobind 2: src="http://code.angularjs.org/0.10.5/angular-0.10.5.js"></script> 3:   4: <table ng:controller="SortableTableCtrl"> 5: <thead> 6: <tr> 7: <th