mongodb中模糊查询

mongodb中实现模糊查询可以直接使用正则表达式,官方也给出了reg的查询方式,首先我们直接来实现下基本的模糊查询,代码很简单,也非常实用,如果你已经创建了一个数据库,并且里面包含了数据,那么你可以直接在命令行使用如下命令进行模糊查询:

db.col.find({name:/小强/})

我们可以看到“/小强/”,这个就是正则表达式了,我们也可以直接使用/^小强/等等正则表达式,都可以查询到相关数据。
但是问题来了,我们在写程序的时候,用户可能查询的是一个变量,这个值并不是固定的,因此使用这样的方法,仅能固定一个关键词。我之前试过以下方法,但是并没有通过

var query="/"+key+"/";
User.find({name:query},function(res,req,next){
.....
});

这种方式,我总是无法获取到我想要的数据,而且返回的都是空,最终我发现了问题,应该是我所定义的query是一个string格式,而并不是正则表达式,因此这种方法是不可行的,大家也不要再使用这样的方式了。下面我将直接使用RegExp方式进行查询。这也是最终能够真正实现模糊查询的方法。

var keyword=req.params.keyword;
var key = {'name': new RegExp(keyword)}; //模糊查询参数
Job.find(key,function (err, jobs) {
        if (err) {
            return res.send(err);
        }
        res.json(jobs);
    })

到此,我们可以实现真正的模糊查询了!

Atom中替换空白行

不论是目前最流行的编辑器,都没有像Dreamweaver那样,直接点击格式化代码的功能了,仅仅是在我们需要闭合标签的时候才会格式化代码。比如Atom,我从别处拷贝过来的代码,竟然是乱七八糟的,有很多空白行,这样一点都不方便我阅读代码。因此就想到如何将其空白行都删除。
很多编辑器都提供查找替换的基本功能,而且很多编辑器都支持正则表达式替换的。因此我们只需要使用正则表达式即可进行相关的替换了。这是我在知乎上找到的相关答案,希望一样可以帮助你。使用正则表达式:

按住ctrl+F,可以看到弹出窗口右上角[ . * ],样式的图标,我们先点击它,目的就是启用正则进行替换。
或快捷键:Alt + Ctrl + / 或 Alt + Cmd + /

输入正则表达式选择换行符与相连续的空字符字符串:\n[ \t]*\n ( [ \t] 中 “\t” 前有空格)
替换为单一换行符:\n

点击:REPLACE ALL (若最大连续空行数为N,则需点击N – 1 次)
全部替换

无论窗口如何变化,图片的中间部分一直位于浏览器中

由于开发需要,为了能够在各个设备中都能保持一个不错的效果,而设计师给的slider图片大部分仅中间有图片,而图片的长度都是2500px,二两边基本都是纯色。在手机设备上浏览时你就会发现,如果我们将图片的宽度设置为100%,那么图片就是缩放得非常小,以致于无法看清中间部分的图片。因此,就需要在窗口变化的过程中,让图片的中间部分一直处于浏览器可见范围内。
刚开始我使用了@media来进行实现,也就是说直接设置图片的宽度为固定的,而图片外面有一个容器,此容器宽度为100%,并且将图片超出部分所隐藏。这样一来,那么我就可以通过margin-left属性设置为负值,即可移动图片中心部位到相应的地方。但是这个方法确实不行,因为你得写很多不同px的设备。很麻烦,而且经常有各种bug,难以解决。最终我选择了jQuery。

1、需求分析

首先监听窗口的宽度,当宽度小于多少的时候,我们再去设置margin-left的值。
而margin-left的值又要该如何计算?
因为我们需要当窗口宽度小于我们所设置的图片宽度时才进行执行margin-left,因此,假如你设置了image的宽度为1200px,那么我们需要使用下面的计算方式:
1200-当前窗口的宽度=被窗口隐藏的图片宽度
这个仅仅是得到了呗窗口隐藏的右边部分图片的宽度,我们再将其除以2之后也就是,被窗口隐藏的图片宽度的一半,这就得到了我们该向左边margin多少。最终得到的计算方式应该如下:
margin-left:-(image_width – window_width)/2
image_width图片的宽度,window_width即当前窗口的宽度
由于需要向左边移动,所以margin-left的值应该是负值。
继续阅读无论窗口如何变化,图片的中间部分一直位于浏览器中

Ionic 2 中使用 Font Awesome 字体

在我以前的Ionic(1.3)应用程序中,我使用了“Font Awesome”作为一个图标集,但在Ionic 2中有很多变化。我使用的gulp脚本已经消失,构建过程在npm包中定义。
您可以在https://github.com/driftyco/ionic-appscripts上阅读更多信息

以下是在Ionic 2中如何做:

我们开始创建一个新的应用程序或cd到你现有的应用程序文件夹。

$ ionic start ionic2FontAwesome blank --v2
$ cd ionic2FontAwesome

我们来添加Font Awesome并保存到你的package.json。

$ npm install font-awesome --save

在项目根目录下创建配置文件夹。

$ mkdir config

找到此文件夹中的copy.config.js文件:/node_modules/@ionic/app-scripts/config/copy.config.js
,并将其复制到刚刚创建的文件夹。 继续阅读Ionic 2 中使用 Font Awesome 字体

node+express图片上传实例

如果使用node+express作为后端的话,肯定是避免不了上传的,因此我们需要使用node+express来对图片或者其他文件进行上传。如果你不使用express也是可以的。这里我们需要使用到一个node插件formidable,这个插件主要提供的就是上传功能。下面开始我们的项目吧。
首先你得搭建node+express环境,如果不知道怎么搭建的,请看我之前写的一篇文章《node+express+mongodb注册登录实例》,文章前半部分有关于环境搭建的说明。搭建完成后,我们需要安装formidable插件,在node中插件安装的方法就是直接使用命令,在项目当前目录下,直接执行npm install xxxx –save(xxxx是插件名称,–save则是将插件写入packge.json文件中)即可安装插件,如此安装formidable就使用以下命令即可:
npm install formidable –sava
也可以使用简写的命令
npm i -S formidable //(i即install,-S,这里的s是大写的,即sava)
安装完成之后,我们首先直接在index.ejs或者index.jade中添加一个表单form,内容如下: 继续阅读node+express图片上传实例

node+express+mongodb注册登录实例

如果你之前对mysql以及Oracle等关系数据库有过了解的话,那么你mongodb对于你来说上手应该是很快的。但是mongodb并不是使用诸如mysql与Oracle中的select、delete、update等关键字进行SQL查询的,因为具mongodb官方介绍说,mongodb是一个nosql的数据库,也就是说,他不需要你对sql语句有一定的了解,但是如果你已经了解了sql语句,那么我相信你学习起来是很快的。
网上已经很多这方面的教程了,为什么我还要在写一次?
主要是因为我在参照网上的相关例子的时候遇到了不少问题,有些例子要么是express版本低,要么就是代码不完整,因此我才打算写这一篇文章来与大家分享下学习心得。本文仅作为express+mongodb入门教程。使用的express版本为~4.15.2,

一、准备工作

看到标题就知道应该需要安装些什么软件了吧,我们需要在电脑上安装nodejs和mongodb,而express是nodejs的一个插件,因此需要通过nodejs来进行安装。
nodejs与mongodb的安装非常的简单,只要你会安装QQ,会安装游戏,那么你就会安装nodejs和mongodb了。不过我们需要注意的是,mongodb安装后,我们需要对其进行相应的设置,以提高我们的开发效率。关于mongodb的使用方法,请大家查看官方的文档。
安装好了mongodb后,我们给mongodb的bin目录添加到环境变量里面,这样我们就可以直接在命令提示符中直接使用mongodb的命令了,省的还要跑到mongodb目录下输命令。下面是设置mongodb的环境变量的方法。

1、mongodb添加环境变量

在桌面上,我的电脑(计算机或者此电脑)右键,点击属性,选择左边的“高级系统设置”,在弹出窗口中,选择“高级”,看到右下角有个“环境变量”,点击它。
之后我们在“系统变量”(不是Administrator的用户变量)中Path中将mongodb的bin目录填写进去,比如我的bin目录是C:\Program Files\MongoDB\Server\3.4\bin。
然后,打开你的命令提示符窗口,输入mongo,如果看到下面的信息,说明你的设置已经成功了。 继续阅读node+express+mongodb注册登录实例

Angular2如何获得多个相同子组件传递的集合

比如我有一个父组件,而在父组件中有多个相同的组件,比如父组件使用了ngFor循环,而在ngFor下面有一个子组件,这样当循环出来后就有很多个子组件了。那么我们要如何才能获得这几个子组件中的相应数据集合呢?之前我到segmentfault进行了提问,但是并没有人为我回答,终于在对官方文档阅读以及google了很多后,终于找到答案了。下面就让我们去解开angular2的面纱吧。
在angular中,我们需要从相同子组件中获取相关字段,我们可以直接使用@ViewChildren,如果你E文较好,那么我们把这个单词拆开来理解@ViewChildren,View Children,view是视图或者显示,children则是孩子或者子类,简单的说就是获取子组件的相关集合。
我使用它做了一个简单的demo,地址是:http://www.egtch.com/demo/angular/
在实例中显示如下图: 继续阅读Angular2如何获得多个相同子组件传递的集合

[转]理解ionic2 + angular2开发方案

1. 安装使用

ionic2的安装运行基本和前版本的ionic基本一致,非常简单。

npm install -g ionic    # 安装ionic工具集
ionic start projectName --v2    # --v2表示使用ionic2 + angular2的组合方式创建项目,否则使用ionic + angular创建项目,此时ionic会下载所需要的相关包
cd projectName  # 进入创建的项目名称目录
ionic serve # 启用浏览器调试应用页面,这时通过浏览器打开默认端口页面http://localhost:8100/#/tab/dash就可以打开应用页面了

当然这里需要保证你的开发环境SDK已经安装成功了,例如Android打包平台的运行环境,可以参考Ionic Hybrid跨终端应用程序开发方案研究

  如果需要在移动设备上打包运行,则需要添加相对应的插件模块。

npm install -g cordova  # 如果没有真实设备,可以通过这个命令来安装模拟环境
ionic platform add ios # 添加ios运行支持
ionic emulate ios   # 模拟运行ios环境
ionic platform add android  # 添加Android运行环境支持
ionic run android   # 使用Android运行应用

  正常情况下,这里ionic会将打包的文件安装到设备或调试模拟器上运行打开应用。
继续阅读[转]理解ionic2 + angular2开发方案

ionic2中页面加载loading效果的实现

ionic是一个基于Angular、Cordova的一个开源框架,它提供了相关的UI库,ionic2中对ionic1进行了更多的优化,让ionic的运行速度,执行效率提高了不少。选择ionic开发web app是个不错的想法。下面就来说下ionic2中的loading效果的实现吧!本文使用TypeScript进行对ionic2的开发,如果不了解微软的TypeScript的,请自己google一下哦!

一、引入LoadingController

我们要使用LoadingController,就必须先引入它,直接使用下面的代码即可实现
import { LoadingController } from ‘ionic-angular’;
引入后,我们就需要在constructor中声明了,如下:
constructor(public loadingCtrl: LoadingController){
//……..在这里执行loading效果或者设置loading的图标、css等
}
看上去是很简单哦,要使用这个loading,那么我们得先创建它。
1、创建create()
直接可以使用create方法,create方法中又包括了以下几个属性:
spinner(设置loading的SVG图片)
content(设置loading的提示文字或内容)
loadingSpinner(这个我暂时没有理解到底是做什么的) 继续阅读ionic2中页面加载loading效果的实现