前端 ----模板引擎

简单使用：
　　1.导入 <script src="template-web.js"></script>
　　2.提供需要替换的内容，在type选择text/html，并把要替换的地方用{{}}括起来

<script type="text/html" id="tp1">
    <div>
        <span>姓名：{{name}}</span>
        <span>年龄：{{age}}</span>
    </div>
</script>            

　　3.替换template方法中，第一个位置为模板编号，第二个为要替换的对象（如data是name：‘张三’）

<script>
    var data={
        name : '张三',
        age : 30
        }
    var html = template('tp1',data);
    //在布局中体现出来
    document.getElementById('container').innerHTML=html
</script>        

 

其他语法：
　　1.@：
　　　　如果是 name : <b>'张三'</b>,即想通过b标签加粗张三，就需要{{@name}},否则就会把b标签显示出来
　　2.if：
　　　　{{if XXX}}内容{{/if}} 满足显示内容,也可以在中间加入{{else}}
　　　　{{if v1}}内容1{{else if v2}}内容2{{/if}} 如果满足v1显示内容1,如果满足v2显示内容2
　　3.循环：
　　　　data=[{name:'张三'},{name:'李四'}],
　　　　{{each targe}}
　　　　　　{{$index}}{{$value}}
　　　　{{/each}}
　　在需要循环的地方加，如：
　　{{each data}}
　　<div>
　　　　<span>姓名：{{$value.name}}</span>
　　</div>
　　{{/each}}
4.导入自定义方法

<div>$imports.dataFormat(time)</div> #使用，要在template方法前使用
//如果方法在全局变量下就可以直接使用，如果方法不在全局变量下，需要导入就像下面

template.defaults.imports.变量名 = 变量值;
$imports.变量名称

function dateFormat（未格式化的原始时间）{
return '已经格式化好的当前时间'
}

template.defaults.imports.dateFormat = dateFormat;
<div>$imports.dataFormat(time)</div>

 

PS:

获取ID时应该是 {{$value._id}} 记得加斜杠
为了防止表单自动提交应该return false

分类的批量删除

上传图片的过程：

// 当管理员选择文件的时候 触发事件（点击选择按钮键 input）
$('#feature').on('change', function () {
// 获取到管理员选择到的文件
var file = this.files[0];
// 创建formData对象 实现二进制文件上传
var formData = new FormData();
// 将管理员选择到的文件追加到formData对象中
formData.append('cover', file);
// 实现文章封面图片上传

$.ajax({
    type: 'post',
    url: '/upload', --------------------图片上传是upload
    data: formData,
    // 告诉$.ajax方法不要处理data属性对应的参数
    processData: false,
    // 告诉$.ajax方法不要设置参数类型
    contentType: false,
    success: function (response) {
        console.log(response)
        $('#thumbnail').val(response[0].cover);
    }
})
});