因为工作原因,需要使用到checkbox list多选项功能. 一直在尝试在checkbox组件中添加NgModel的属性,但是只能在单个checkbox复选框上使用,checkbox list就没办法了. 好吧,其实是想差了. 因为是对checkbox的div添加ngFor的循环,所以每个checkbox都相当于list中的item,直接在item的属性,多加一个checked就好了,然后使用选中的list时filter checked==true就好了. checkbox-list.comp…
上一篇说到了Checkbox List的公共组件提取,现在说一下Radio List的公共组件提取. Radio List组件提取起来很方便,不想Checkbox那么复杂. radio-list.component.ts import { Component, OnInit, Input, Output, EventEmitter } from '@angular/core'; import { RadioItem } from '../../model/radio'; import { NgM…
为什么需要提取公共代码 大型网站通常会由多个页面组成,每个页面都是一个独立的单页应用. 但由于所有页面都采用同样的技术栈,以及使用同一套样式代码,这导致这些页面之间有很多相同的代码. 如果每个页面的代码都把这些公共的部分包含进去,会造成以下问题: 相同的资源被重复的加载,浪费用户的流量和服务器的成本: 每个页面需要加载的资源太大,导致网页首屏加载缓慢,影响用户体验. 如果把多个页面公共的代码抽离成单独的文件,就能优化以上问题. 原因是假如用户访问了网站的其中一个网页,那么访问这个网站下的其它网页…
webpack - 多页面/入口支持 & 公共组件单独打包 webpack系列目录 webpack 系列 一:模块系统的演进 webpack 系列 二:webpack 介绍&安装 webpack 系列 三:webpack 如何集成第三方js库 webpack 系列 四:webpack 多页面支持 & 公共组件单独打包 webpack 系列 五:webpack Loaders 模块加载器 webpack 系列 六:前端项目模板-webpack+gulp实现自动构建部署 本系列并非全部…
转载自:http://www.jb51.net/article/117490.htm 本篇主要介绍:如何自动构建入口文件,并生成对应的output:公共js库如何单独打包. 多入口文件,自动扫描入口.同时支持SPA和多页面型的项目 公共js库如何单独打包. 基础结构和准备工作 以下示例基于上一篇进行改进,上一篇项目源码 目录结构说明 ? 1 2 3 4 5 6 7 8 9 10 11 12 13 . ├── package.json    # 项目配置 ├── src      # 源码目录 │…
一个技术汪的开源梦 —— 目录 想必大家在项目开发的时候应该都在程序中调用过自己内部的接口或者使用过第三方提供的接口,咱今天不讨论 REST ,最常用的请求应该就是 GET 和 POST 了,那下面开始讲解对于 Http 请求客户端的简单封装. 首先,说一个好消息 就是 .Net Core 已将之前的 System.Net.Http 组件默认添加到了 NETStandard.Library 库中,所以直接用就好了,不需要再额外在 Nuget 上安装了,说道 Nuget 后续计划会有一篇文章介绍…
Net Core 的公共组件之 Http 请求客户端 想必大家在项目开发的时候应该都在程序中调用过自己内部的接口或者使用过第三方提供的接口,咱今天不讨论 REST ,最常用的请求应该就是 GET 和 POST 了,那下面开始讲解对于 Http 请求客户端的简单封装. 首先,说一个好消息 就是 .Net Core 已将之前的 System.Net.Http 组件默认添加到了 NETStandard.Library 库中,所以直接用就好了,不需要再额外在 Nuget 上安装了,说道 Nuget 后续…
背景 每月给业务部门提取数据,每个分公司都要提取一般,先跑SQL,再粘贴到Excel中,然后发邮件给相关的人员.费时费力,还容易粘贴错位.因此,需要通过一个程序完成这些步骤.我首先想到的是通过SSIS完成这些工作:包括三步.第一,提取数据并生成各个分公司的Excel文件:第二,压缩文件:第三步,发送邮件. 由于对SSIS并不熟练,看过网上一些文章并自己琢磨后,提炼出一些相关的功能.希望本文能够对工作中的你有所帮助. 目的 学习SSIS中的遍历组件.实例:生成对应分公司的Excel文件,每个分公司…
以 分页 组件为例:(根据自己具体业务编写) 1.pagination.vue <template> <!-- 分页 --> <div class="table-pagination" v-if="flag"> <template> <div class="block"> <el-pagination @size-change="handleSizeChange"…
一.前言                    1.公共轮播图的实现                    2.组件传参,公共组件的实现 二.主要内容 1.公共轮播图的实现 (1)分析:当渲染不同的轮播图页面的时候,①轮播图的图片数据不一样,②轮播图的高度可能不一样(可以通过之前父子组件传参) (2)在Common文件夹下创建公共组件MySwiper (3)在main.js中注册全局的轮播组件 //注册全局的轮播图组件 import MySwiper from '@/components/Com…