差不多学习接近两个星期了吧。
从开始什么都不懂的小白,到后来配置linux环境,在然后完成第一张卡。期间遇到了很多问题,请教小伙伴们,自己查找资料。不过收获也比想象的多很多。
以下所有总结都是这段时间自己的学习和理解,肯定会有很多偏差。希望大家看完之后可以及时的帮我改正,谢谢!!!。
party-bid step 1
主要学习应用到的部分知识有:AngularJS 框架、JavaScript语言、Ruby语言、Html Haml语言、 CSS样式表、node.js架构、GitHub服务。
在JS中一个很实用的函数 :
console.log()
这个在你编写程序的时候,当程序逻辑比较复杂时这个函数就派上用场了。它的作用是在console中输 出.log()中括号内的内容。你可以把它写在你的代码中,可以帮你查看代码的执行情况。
介绍一下$scope:
scope直译是‘范围’,标准的说法是作用域。controller中我们会通过‘$scope’将scope传递给controller
举例:
<button>{{xxxx}</button>
$scope.example='你好'
在页面把一个button设置为‘{{XXXX}}’,然后在Controller中,通过$scope获取到XXXX这个变量,并赋 值'你好',页面中的button上将展示‘你好’字样。
还可以通过$scope绑定函数。比如要给某个按钮实现某种功能。
举例:
<button ng-click='alert_tip()'>{{XXXX}}</button>
$scope.alert_tip = function(){alert('你好')}
这样 给button点击事件绑定一个函数为“alert_tip()”在Controller中,通过$scope.alerttip 可以编写这个函数的具体代码。
先说一下AngularJS模板的核心功能——绑定
<p>Nothing here {{'yet' + '!'}}</p>
是由双大括号{{}}和表达式做成。它的主要特点就是实现了数据的双向绑定,可以直接引用。如果作用 域的变量发生了改变,我们随时可以让相应的页面表现也随之改变。
举个例子
<p id="test" ng-controller="TestCtrl">{{ a }}</p>
<script type="text/javascript">
var TestCtrl = function($scope){
$scope.a = '123';
}
上面的例子在页面载入之后,我们可以在页面上看到 123。这时,我们可以打开一个终端控制器,输入:
$('#test').scope().a = '12345';
$('#test').scope().$digest();
上面的代码执行之后,就可以看到页面变化了。
下边说一下AngularJS中的MVC架构模式准确的说是MVW其实也是 模型-视图-控制器(MVC) 模式。
路由功能:
路由器模板:
.when('/main', {
templateUrl: '页面模板',
controller: '控制器'
})
举例:
.when('/enter_activity',{
templateUrl:'views/enter_activity.html',
controller:'EnterActivityCtrl'
}
.when函数将views/enter_activity.html地址与EnterActivityCtrl控制器联系起来。当访问/enter_activity 时交给EnterActivityCtrl相应。
AngularJS中ng—Repeat数组使用方法:
举例:
<li ng-repeat='number in numbers'>{{number}}</li>
ng—repeat把numbers数组中的所有元素先付给number,然后通过{{number}}显示出来.
AngularJS中的ng-Show:
举例:
<div ng-show='true'>name</div>
<div ng-show='false'>age</div>
ng-Show它可以显示或隐藏页面元素。ngShow的属性为真时显示内容,否则不显示。
做 party-bid的第一部分时,在电脑页面上没有任何异常,当打包成apk传到手机时进去app后,会出现像页面一样可以滑动的问题。
解决方法是:
修改index.html中 一个class为
class="container-fluid"
Turn any fixed-width grid layout into a full-width layout by changing your outermost .container to .container-fluid.
大概意思是:把任何固定宽度的网格布局成一个完整宽度的布局,通过改变你的最外层的容器来改变容器流体。
ng-disabled
可以绑定一个输入文本框,通过文本框里是否有内容,可以控制button的状态。
本地存储部分问题:
JSON.stringify(xxx)
将数组转换成 JSON 字符串
JSON.parse (xxx)
将该字符串重新转换成数组
localStorage.setItem
用于存数据,
localStorage.getItem
用于取数据
var activities=JSON.parse(localStorage.getItem("activities"))
取出activities转化成数组赋值给activities。
localStorage.setItem("activities", JSON.stringify(activities))
把activities转换为字符串存进activities中.
$scope.activities=JSON.parse(localStorage.getItem('activities'))
取activities中的字符串并转换为数组.
activities.unshift(activity);
unshift和push相反,push先进的在栈底,unshift先进的在栈顶