mkdir  angular6project

cd angular6project

ng new demo      新建一个普通项目

ng new demo --routing  新建一个带路由的项目

新建项目过程比较慢

新建完成之后

cd demo

ng serve --open

若要切换端口启动angular项目可以使用如下命令

ng serve --port=8888

或者修改项目文件,有如下两种方式:

1.修改node_modules/@angular/cli/lib/config/schema.json,搜索4200,修改目的端口号

2.或者修改package.json中script属性中start的内容为ng serve --port=8888

使用脚手架angularcli进行组件的新建

ng g component components/header

服务的新建

ng g service my-new-service

****.component.ts中声明属性的几种方式

1.msg = ‘12312’; //默认

2,msg:any;

public list:any[];

construct中赋初值

3.msg:类型=‘21312’;

如,msg:string=''21312;

属性的修饰符,public(默认),protected,private

public:可以在类内也可以在类外访问

protected:当前类及子类访问

private:当前类访问

angular6中引入第三方库的步骤,以jquery和bootstrap为例

1.npm install  jquery --save

npm install bootstrap --save

2.在angular.json文件中的styles和scripts字段中加入需要引用的第三方库

如 "../node_modules/jquery/dist/js/jquery.js"

3.安装jquery和bootstrap的类型描述文件,因为angular6是基于ts的,而第三方库是基于js的,所以需要安装

npm install @types/jquery --save-dev

npm install @types/bootstarp --save-dev

失败。。。

angular6新建项目的更多相关文章

  1. 每次新建项目出现appcompat_v7 解决方法

    ADT升级版本后每次新建项目出现appcompat_v7 , 解决方案如下 问题生成:

  2. MVC3 新建项目

    一.安装工具 二.新建项目 step1:新建MVC3项目 打开新建项目窗口,在“已安装的模板”列表中选择“Web”,在右侧应用程序模板列表中选择“ASP.NET MVC3 Web应用程序”,修改项目名 ...

  3. vue新建项目

    一直都被如何用vue.js新建一个项目的问题困扰着,经过好久的实践,终于搞清楚如何用vue新建项目了: 1.官网对于vue-cli介绍: Vue.js provides an official CLI ...

  4. VS2012新建项目出错:未找到与约束ContractName Microsoft.VisualStudio.Text.ITextDocumentFactoryService

    刚刚重新做的系统,第一次打开vs2012新建项目时出现错误提示 通过查找解决办法发现方法有两种: 1:卸载两个windows更新补丁(KB2833957和KB2840642) 2:安装一个window ...

  5. MyEclipse/Eclipse新建项目并且部署到服务器(tomcat)下

    1新建项目:file/new/web project/项目名/ok 2部署到tomcat下:tomcat右单机>>add/remove/选择项目/添加/完成(tomcat下有新建的项目) ...

  6. SharePoint 2013 新建项目字段自动加载上次保存值

    1.点击进入NewForm.aspx页面,编辑页面,插入Script Editor WebPart,如下图: 2.插入后如下图,拖动AutoRecord WebPart到脚本编辑器上面,防止因为加载顺 ...

  7. VS 2015打开项目闪退,新建项目提示未将对象引用到实例

    因为开发需要,要把开发工具换成visual studio2015,装完之后会有警告“js”安装的问题,打开VS也没有问题, 但是一打开项目就闪退,新建项目也不行,查看应用程序日志,报错提示如下: .N ...

  8. 【android studio】解决android studio drawable新建项目时只有一个drawable目录的问题

    概述 android studio默认新建Module时,只新建一个drawable目录,并不会新建适配不同分辨率的drawable目录.但其实,这是可以设置的.有以下两种方法: 方法1 详细步骤 进 ...

  9. git 新建项目

    备份. 1.cd dirctory 2.git init 3.git.oschina.net 上新建项目. 4.git remote add origin XXX.git 5.git push ...

随机推荐

  1. JAVASCRIPT 分层概念

    1)底层(框架提供): 封装DOM和Event相关操作,提供跨浏览器兼容的接口,扩展原生javascript语言本身不提供的但又特实用的接口,例如namespace; 2)抽象类层(框架提供 统一自定 ...

  2. Base64 空格,加号问题

    缘由: 在一个项目中,app请求tcpdump日志与记录的日志内容不一致 请求%2B 识别成 + 请求 + 识别成 空格 这个在base64解密的时候会出现异常,base64需要的是加号,而不是空格 ...

  3. vue+vux scrollTop无法实现定位到具体dom

    先看一下最终的运行效果. 项目背景介绍:技术栈: vue+vux+nodejs需求:对汽车品牌列表可以按照字母进行索引定位 在开发中实现这种需求,心想还不是小菜一碟,作为一个饱经bug的程序员,别的我 ...

  4. CSS布局学习(三) - position属性定义及解释(官网直译)

    static ①元素的位置是在文档正常布局流中的位置. ②设置top right bottom left与z-index无效. ③在未指定position时,static是默认值 以下例子进行说明: ...

  5. pictureBox绑定Base64字符串

    if (!string.IsNullOrEmpty(imageCode)) { byte[] bytes = Convert.FromBase64String(imageCode); MemorySt ...

  6. 雷林鹏分享:jQuery EasyUI 数据网格 - 启用行内编辑

    jQuery EasyUI 数据网格 - 启用行内编辑 可编辑的功能是最近添加到数据网格(datagrid)的.它可以使用户添加一个新行到数据网格(datagrid).用户也可以更新一个或多个行. 本 ...

  7. laravel command调用方法命令

  8. ZCRM_AU_MAIL

    FUNCTION ZCRM_AU_MAIL. *"---------------------------------------------------------------------- ...

  9. 海量日志采集Flume(HA)

    海量日志采集Flume(HA) 1.介绍: Flume是Cloudera提供的一个高可用的,高可靠的,分布式的海量日志采集.聚合和传输的系统,Flume支持在日志系统中定制各类数据发送方,用于收集数据 ...

  10. vuex实现原理

    一.Store的层次结构 Store,负责管理整个数据访问.修改等: 提高API: State,数据结构: 所有的getters.mutations,全部都注册到store里:结构大概是: { 'xx ...