实现标签的添加与删除(tags)

在项目中会遇到,标签(tags)的添加与去除的需求

demo:我们有 tags   ‘专利’,‘商标’,‘版权’,‘域名’

demand:在发布内容的时候,要求可以添加tag,(实现tag的增加与删除)

html: 

<ul class="list-inline">
<li>
<a class="btn btn-sm btn-outline-green "
ng-init="pr=false"
ng-click="pr=!pr;addTag('专利',pr)"
ng-class="{true:'btn-active',false:''}[pr]">
专利
</a>
</li>
<li>
<a class="btn btn-sm btn-outline-green"
ng-init="cl=false"
ng-click="cl=!cl;addTag('商标',cl)"
ng-class="{true:'btn-active',false:''}[cl]">
商标
</a>
</li>
<li>
<a class="btn btn-sm btn-outline-green"
ng-init="cr=false"
ng-click="cr=!cr;addTag('版权',cr)"
ng-class="{true:'btn-active',false:''}[cr]"
>版权</a></li>
<li><a class="btn btn-sm btn-outline-green"
ng-init="dn=false"
ng-click="dn=!dn;addTag('域名',dn)"
ng-class="{true:'btn-active',false:''}[dn]"
>域名</a></li>
</ul>  

js:

//标签的增加,与删除(发布创意中)

 s.addTag = function (str, sta) {//参数一:tag 的名字,参数二:状态(true,false)
if (sta) {
s.ideas.tags.push(str);//添加
}
else {
s.ideas.tags.splice(s.ideas.tags.indexOf(str), 1);//删除
}
console.log(s.ideas.tags);
};
上一篇:CSS实现下拉菜单的几种方法


下一篇:纯洁CSS实现下拉菜单和下拉容器(纯洁CSS导航栏和导航下拉容器)