web首张卡开发须知
1.css样式的引用
将写好的样式引入到ruby编程开发工具中的index.haml下
格式如下:
%link(rel="stylesheet" type="text/css" href="css/bootstrapswitch-custom.css")
%link(rel="stylesheet" type="text/css" href="css/font-awesome.css")
%link(rel="stylesheet" type="text/css" href="css/index.css")
2.js函数的使用
$scope.this_function_name=function(){
函数体
}
函数也可写成这样,效果一样
function this_function_name(){
函数体
}
$scope用于js与haml界面交互
函数使用时需要注重提高其复用性(通过参数传递区分是哪部分调用的这个函数),函数也可以相互调用,例如:
$scope.this_function_name=function(){
this_function_name(activity) //此处通过函数调用将activity参数下面函数的name
}
function this_function_name(name){ //此处name与下面的name通过参数传递提高function复用性
for(var i=0,l=activities.length;i<l;i++) {
if (activities[i].name == name) {
return true;
}
}
return false;
}
3.一些常用ng总结ng-tap ng-repeat ng-show ng-disabeld
ng-tap 页面跳转,也可用于控制按钮的相关属性设置 %button.btn-4(ng-tap='go_create()'按钮
ng-repeat 遍历创建对象元素 %li( ng-repeat ="activity in activities")
ng-show显隐控制，控制按钮在一种状态下隐藏另一种状态下显示。
ng-disabled常用于输入框对应控制按钮的可点击与不可点击控制,数据类型为布尔型。
4.数据存储
localStorage.setItem('activities',JSON.stringify(activities));数据存储语句，将activities存入activities，对于网站等存储一般是存储数组型数据，之前要先定义数组
定义数组如下：
var activities=JSON.parse(localStorage.getItem('activities'));定义一个activities数组