. 现在开始需要集成angular6到VS项目中

1.1 打开Startup.cs文件, 在ConfigureServices方法中配置angular files的目录.

1.2 在Configure方法中配置启动npm脚本.

到这一步,我们可以通过F5 运行整个VS项目,并且能够看到angular欢迎界面,但是还没有从我们的web api 得到data.

1.3 回到vs code 工具,我需要通过vs code 去创建一些ts文件.

1.3.1 首先先创建一个endpoint factory service,创建成功会生成2个file,我是通过命令创建

打开endpoint-factory.service.ts文件

定义webapi的地址并且注入httpclient对象.

1.3.2 创建一个angular service,注入上面创建的endpoint-factory对象.

1.3.3 打开app.component.ts文件, 实现接口OnInit,在初始化方法里面调用我们的service.

1.3.4 打开app.component.html 添加一个html节点去输出data.

1.3.5 接下来我们需要去App.module.ts里面注册我们的服务并且引入http模块.

可以发现我们提供了2个服务 ValuesService,EndpointFactoryService.以及引入了HttpClientModule模块.

到此,可以运行整个项目.......... 能够看见已经从web api中读取出来并显示.

接下来 要加入EF Core从database提取数据...

.Net Core+Angular6 学习 第三部分(从api获取data)的更多相关文章

  1. .Net Core+Angular6 学习 第一部分(创建web api)

    . 创建.net core web api 1.1 选择一个empty 模式,里面只有简单的2个class 1.2 配置web api 的路由. 1.2.1 打开Startup.cs,首先引用conf ...

  2. .Net Core+Angular6 学习 第四部分(EF Core(Code First))

    目的: 打算通过EF core 练习从database receive data 显示到UI. 1. 创建一个新的project Model.定义一个 base interface entity以及实 ...

  3. .Net Core+Angular6 学习 第二部分(创建Angular6项目)

    . 创建angular6 前提: 需要安装nodejs以及angular的脚手架,Angular官网要求Angular6.0必须在node 8.x 和 npm 5.x 以上的版本才能正常使用. 我的版 ...

  4. 【js】vue 2.5.1 源码学习 （三） Vue.extend 和 data的合并策略

    大体思路 (三)  1. 子类父类  2.Vue.extend()      //创建vue的子类 组件的语法器 Vue.extend(options) Profile().$mount('#app' ...

  5. Spark2.0学习（三）--------核心API

    Spark核心API----------------- [SparkContext] 连接到spark集群,入口点. [HadoopRDD] 读取hadoop上的数据, [MapPartitionsR ...

  6. Python3对接华三CAS平台Api获取虚拟机监控信息-渐入佳境

    --时间:2021年2月3日 --作者:飞翔的小胖猪 说明 使用python对接华三CAS虚拟化平台,通过厂商提供的api接口获取每个集群下所有虚拟机的监控信息,并保存数据在本地的mariadb数据库 ...

  7. sql server 关于表中只增标识问题 C# 实现自动化打开和关闭可执行文件（或 关闭停止与系统交互的可执行文件） ajaxfileupload插件上传图片功能，用MVC和aspx做后台各写了一个案例 将小写阿拉伯数字转换成大写的汉字， C# WinForm 中英文实现， 国际化实现的简单方法 ASP.NET Core 2 学习笔记（六）ASP.NET Core 2 学习笔记（三）

    sql server 关于表中只增标识问题   由于我们系统时间用的过长,数据量大,设计是采用自增ID 我们插入数据的时候把ID也写进去,我们可以采用 关闭和开启自增标识 没有关闭的时候 ,提示一下错 ...

  8. Angular6 学习笔记——路由详解

    angular6.x系列的学习笔记记录,仍在不断完善中,学习地址: https://www.angular.cn/guide/template-syntax http://www.ngfans.net ...

  9. 从零开始学习jQuery (三) 管理jQuery包装集

    本系列文章导航 从零开始学习jQuery (三) 管理jQuery包装集 一.摘要 在使用jQuery选择器获取到jQuery包装集后, 我们需要对其进行操作. 本章首先讲解如何动态的创建元素, 接着 ...

随机推荐

  1. [经验]怎么删除“通过QQ/TIM发送到”右键菜单

      首先打开QQ主面板上的系统设置   选择[基本设置]-[文件管理]菜单,并将如图所示的选项去掉勾选即可

  2. 给Mac的Dictionary添加其他原装词典

    原文:https://www.zhihu.com/question/20428599/answer/223511099 (含下载,但需要论坛注册) 下载(百度网盘):https://blog.csdn ...

  3. Element.scrollIntoView()

    Element.scrollIntoView() 方法让当前的元素滚动到浏览器窗口的可视区域内 语法 element.scrollIntoView(); element.scrollIntoView( ...

  4. [record]WebLogic域之创建-文本界面

    WebLogic域的创建方式主要有图形界面.文本方式(字符界面).脚本方式(WLST脚本)等,本文用文本方式来创建域. 一.启动Configuration Wizard •config.cmd/con ...

  5. day 08 文件操作

    1.文件操作 1.文件操作 模特主妇护士老师.txt 1.文件路径:d:\ 模特主妇护士老师.txt 2.编码方式:utf-8 3.操作方式:只读,只写,追加,读写,写读 以什么编码方式储存的,就必须 ...

  6. Python2.7.13下载安装全过程（Windows版）

    前提:    我下载的Python是windows版本的,演示过程是在win10 64位操作系统上安装的. 1.下载 进入官网https://www.python.org/,找到Dowdloads,根 ...

  7. day42-python消息队列一

    消息队列”是在消息的传输过程中保存消息的容器.消息队列最经典的用法就是消费者和生成者之间通过消息管道来传递消息,消费者和生成者是不通的进程.生产者往管道中写消息,消费者从管道中读消息.操作系统提供了很 ...

  8. windows版influxDB安装与配置

    一.下载链接https://portal.influxdata.com/downloads,选windows版 二.解压到安装盘,目录如下 三.修改conf文件,代码如下,直接复制粘贴(1.4.2版本 ...

  9. yuv2mp4

    >您使用什么类型的YUV像素格式?最常见的格式是YUV4:2:0平面8位(YUV420p).您可以键入ffmpeg -pix_fmts以获取所有可用格式的列表.>什么是帧率?在我的例子中, ...

  10. LeetCode算法历程-02

    编写一个程序判断给定的数是否为丑数. 丑数就是只包含质因数 2, 3, 5 的正整数. 示例 1: 输入: 6 输出: true 解释: 6 = 2 × 3 示例 2: 输入: 8 输出: true ...