angular中使用css全局变量定义

html-css013

angular中使用css全局变量定义,第1张

删除数组指定下标或指定对象。

全局变量定义:删除数组指定下标或指定对象。将使用Angular7和CSS变量构建一个超级简单的加密货币列表应用程序。AngualrJS中设置全局变量,即每个Controller中都可以访问的变量。

Angular是一款来自谷歌开源的web前端框架,诞生于2009年,由MiskoHevery等人创建,后为Google所收购。

用指令,

ele.bind("click",function(){

ele.find("i").removeClass("remove").addClass("add")

})

给i一个ng-class属性,属性值是一个在controller中定义的,绑定到该scope的变量,例如: $scope.aClass = 'test1'

给li元素添加ng-click属性,ng-click="listClicked()"

在controller中定义响应事件: $scope.listClicked = () { $scope.aClass = 'test2'}

1、安装node, yarn,网上对应的都有安装教程

2、执行yarn global add @angular/cli,安装angular的脚手架,运行ng version查看是否安装成功

3、执行ng new projectName --style=less 创建样式语法为less的项目

可用选项

--dry-run: boolean, 默认为 false, 若设置 dry-run 则不会创建任何文件

--verbose: boolean, 默认为 false

--link-cli: boolean, 默认为 false, 自动链接到 @angular/cli 包

--skip-install: boolean, 默认为 false, 表示跳过 npm install

--skip-git: boolean, 默认为 false, 表示该目录不初始化为 git 仓库

--skip-tests: boolean, 默认为 false, 表示不创建 tests 相关文件

--skip-commit: boolean, 默认为 false, 表示不进行初始提交

--directory: string, 用于设置创建的目录名,默认与应用程序的同名

--source-dir: string, 默认为 'src', 用于设置源文件目录的名称

--style: string, 默认为 'css', 用于设置选用的样式语法 ('css', 'less' or 'scss')

--prefix: string, 默认为 'app', 用于设置创建新组件时,组件选择器使用的前缀

--mobile: boolean, 默认为 false,表示是否生成 Progressive Web App 应用程序

--routing: boolean, 默认为 false, 表示新增带有路由信息的模块,并添加到根模块中

--inline-style: boolean, 默认为 false, 表示当创建新的应用程序时,使用内联样式

--inline-template: boolean, 默认为 false, 表示当创建新的应用程序时,使用内联模板

4、运行项目

   ng serve  命令启动项目

   ng serve --open 启动完毕会自动打开浏览器,可以简写成 ng serve --o

5、打包项目

执行ng build--prod--build-optimizer命令打包

6、运行打包文件

mac电脑进入dist文件下的打包文件,运行python -m SimpleHTTPServer 8080命令后,在浏览器输入localhost:8080即可展示项目页面

windows,运行yarn global add http-server或者npm install http-server -g安装http-server插件,进入打包文件根目录,执行http-server,即可运行打包项目