详解Angular-cli生成组件修改css成less或sass的实例 使用cli命令生成组件: ng generate component 组件名 生成出来的组件文件有：html / ts / css / spec.ts问题我是一个less重度患者怎么可能再去写css呢。 于是我就在想使用cli生成组件的时候能直接生成出来的是less文件而不是css文件； 修改angular-cli.json文件： apps "styles": ["styles.less"] "defaults": "styleExt": "less",这样就能用组件命令生成的时候替换css文件成les...
本文介绍了详解angularjs获取元素以及angular.element()用法 ，分享给大家，具体如下：addClass()-为每个匹配的元素添加指定的样式类名after()-在匹配元素集合中的每个元素后面插入参数所指定的内容，作为其兄弟节点append()-在每个匹配元素里面的末尾处插入参数内容attr() - 获取匹配的元素集合中的第一个元素的属性的值bind() - 为一个元素绑定一个事件处理程序children() - 获得匹配元素集合中每个元素的子元素，选择器选择性筛...
AngularJS中使用three.js的实例详解 一、轨迹球的引入问题 一开始我是用下面的方式引如轨迹球，但是会报Trackballcontrols is undefined的错。 import * as THREE from three; import * as Trackballcontrols from three;但其实我是能够在node_module下的threejs的包中找到Trackballcontrols的文件的，我一开始以为是引用的路径没对然后修改路径到对应包下Trackballcontrols.js所在的位置。尝试后发现错误依然在。google后发现有类...
最近在做项目时，遇到了需要用到多选按钮选中触发事件的功能，因此我查找了一下AngularJS的提供的指令，但是没有发现相应的指令。而一个看起来很像的指令就是ng-checked，但是这个指令是用来代替标签里面checked属性的，所以也用不了。因此我就自己动手试着写一个这样的指令，相应的代码如下： <form name="test_form" ng-controller="TestCtrl"> <input type="checkbox" name="a" ng-model="a" id="check" ng-checking="say()"/> ...
本文实例讲述了AngularJS实现的JSONP跨域访问数据传输功能。分享给大家供大家参考，具体如下： 大家会自然想到只有一个字母之差的JSON吧~ JSON(JavaScript Object Notation)和JSONP(JSON with Padding)虽然只有一个字母的差别，但其实他们根本不是一回事儿 JSON是一种数据交换格式，而JSONP是一种依靠开发人员的聪明才智创造出的一种非官方跨域数据交互协议。我们拿最近比较火的谍战片来打个比方，JSON是地下党们用来书写和交换情报...
gulp介绍 基于流的前端自动化构建工具，利用gulp可以提高前端开发效率，特别是在前后端分离的项目中。使用gulp能完成以下任务：压缩html、css和js编译less或sass等压缩图片启动本地静态服务器其他目标 一键安装项目所有的依赖模块一键安装项目所有的依赖库代码检查确保严格语法正确能将angularjs的html装换成js模块并且压缩到js文件中将所有css文件合并压缩将所有的js文件合并压缩动态引入资源文件拥有开发环境和生产环境两种打包方...
本文介绍了Angular CLI + Electron 开发环境搭建，分享给大家 用 @angular/cli 配合 Electron 构建桌面软件开发环境，可以在 Electron 中使用 Angular 的各种特性，使开发桌面软件像开发网站一样简单、快捷，而且可以模块化，紧跟最新技术趋势。 安装 Angular CLI 和 Electron 首先使用 npm 安装 Angular Cli： $ npm i -g @angular/cli然后安装 Electron $ npm i -g electron创建项目 用 Angular CLI 创建一个新项目： $ ng new P...
这两天我用ng-options过程中遇到的初始值为空白的问题，记得去年就遇到过，怎么解决的忘记了，费了一阵子功夫之后解决了，想记下来，方便遇到同样问题的小伙伴当然还有自己。 1.场景： 就是做一个查询列表的弹窗，其中有一个条件需要用到下拉菜单，数据是用过ajax传递过去的。2.实现： a.html: <select ng-model="myselect" ng-options="o for o in options"></select> b.js:var url = xxxxxx;//该url只是举例，具体的代码要写可用...
在上一篇博客中我们已经通过Angular CLI命令行工具创建出来一个全新的Angular项目，要想写项目，首先我们要先搞清楚项目的目录结构是怎样的，每个文件又有什么意义，文件中的代码又起到什么作用。 首先看一下整体的目录结构： 可以看到，命令行工具自动生成了很多文件和目录，我们来说说这些目录是干什么的 首层目录： node_modules 第三方依赖包存放目录 e2e 端到端的测试目录 用来做自动测试的 src 应用源代码...
最近在学习Angular方面的知识，今天学习了Angular中使用第三方的库，分享给大家 如果我们想在Angular中使用第三方的库，比如jquery或bootstrap等，该如果做呢？ 首先我们先来看看package.json这个文件，在目录介绍那篇博客中我们已经知道，package.json这个文件列出了项目所使用的第三方依赖包。我们在创建新项目的时候默认会给我们下载一些包，这些是Angular自带的，存放在node_modules目录中。需要注意的是： package.json中有de...
前言 最近因为项目的需要，经常有一些对input输入进行格式化的需求，以前做的时候在js中写指令进行处理，但是这样又要在js或者在java代码中将请求的数据进行还原，很是麻烦，于是在网上看到了jquery的inputmask组件，觉得很好用，在项目中写出指令，用起来很方便。 方法如下： 在项目中引入jquery和jquery-inputmask，然后在项目中写指令，如下： define([./module], function (directives) {use strict;directives.directive(inpu...
本文实例讲述了AngularJS学习笔记之表单验证功能。分享给大家供大家参考，具体如下： 一、执行基本的表单验证 <!DOCTYPE html> <html ng-app=exampleApp><head><meta charset="UTF-8"><title>表单</title><script src="../../js/angular.min.js" type="text/javascript" charset="utf-8"></script><link rel="stylesheet" type="text/css" href="../../css/bootstrap.css" rel="external nofollow" rel="external nofollow" rel="e...
前言 ngrx 是 Angular框架的状态容器，提供可预测化的状态管理。下面话不多说，来一起看看详细的介绍： 1.首先创建一个可路由访问的模块 这里命名为：DemopetModule。 包括文件：demopet.html、demopet.scss、demopet.component.ts、demopet.routes.ts、demopet.module.ts 代码如下： demopet.html <!--暂时放一个标签--> <h1>Demo</h1>demopet.scss h1{color:#d70029; }demopet.component.ts import { Component} from @angular/c...
前戏 面向模型编程；测试驱动开发；先保障交互逻辑，再调整细节。---by 雪狼。为什么要自动化测试？ 1，提高产出质量。 2，减少重构时的痛。反正我最近重构多了，痛苦经历多了。 3，便于新人接手。 angular自动化测试主要分：端到端测试和单元测试，很明显两者都要熟练掌握。 端到端测试是从用户的角度出发，认为整个系统是个黑盒，只会有UI暴露给用户，主要是模仿人工操作测试。 单元测试认为整个系统是白盒，可以...
1.跨域请求产生 随着不同终端(Pad/Mobile/PC)的兴起，对开发人员的要求越来越高，纯浏览器端的响应式已经不能满足用户体验的高要求，我们往往需要针对不同的终端开发定制的版本。为了提升开发效率，前后端分离的需求越来越被重视，后端负责业务/数据接口，前端负责展现/交互逻辑，同一份数据接口，我们可以定制开发多个版本。 而前后端分离带来的一个问题就是前端web部署的服务器和后端提供服务的服务器大概率不在同一个域名下，进...