发表于： 2017-05-08 18:16:25
1 900
今天完成的事情：
Angular level0 to angular level 1
明天计划的事情：
Just angular Level up.
遇到的问题：
何以解惑,唯有Codeschool
疑问
var app = angular.module('gemStore', []);
这里的[]是什么意思？
{{stringA + "" + strinB}}
表达式中""的作用是什么？
ng-controller = "controller as 别名"和$scope的概念很迷,因为没接触scope
听了二大的解释一脸懵逼。。。
自己百度
这是原来的angular语法
在angular1.2版本之后可以这么写, 少了 1bit 2333 并且更加 semantic
controller as XXX 这个语法目前只能把 后面这个参数当成是 别名
收获：
在codeschool里学习angular1.x
定义一个变量为 app的angular 应用
angular 变量名主打 以 驼峰命名法 命名
定义一个app 启用 angular 模块 这个模块的名字叫做 gemStore
var app = angular.module('gemStore', []);
angular 整体 基于 data作业
angular core is 在创建module数据的同时传输数据给severs
var gem = {
name: 'Dodecahedron',
price: 2.95,
description: '...',
canPurchase: false, //定义一个false的属性让ng-show不能点击
}
ng-hide隐藏可以通过改变对象的true和false来改变ng-show和ng-hide的属性
ng-repeat 的方法 相当于 coffee 的 for in 循环
语法 为
首先创建一个数组
在控制器里定义products
this.products = gems
var gems = [ //数组
{
name: "Dodecahedron",
price: 2.95,
description: "...",
canPurchase: true,
},
{
name: "Dodecahedron",
price: 5.95,
description: "...",
canPurchase: false,
}
];
html代码如下
<body ng-controller="StoreController as store"> //控制器 别名 store
<div ng-repeat="product in store.products"> // 产品 在 store控制器的产品（复数）中
<h1> {{product.name}} </h1> // 输出 h1 store 下 products 对象的名字
<h2> ${{product.price}} </h2> // 输出 h2 store 下 products 对象的价格
<p> {{product.description}} </p> // 输出 p store 下 products 对象的描述
<button ng-show="product.canPurchase"> // ng-show 对象能不能买的状态控制 按钮是否存在
Add to Cart</button>
</div>
…
</div>
</body>
调用button写法
<button ng-show="store.product.canPuichase"> Add to Cart </button>
ng-show
codeschool is a good place
返回列表
评论