有时，通过它们你会发现应用上的一些奇怪的事情（比如：应用了多个 UI 框架），或许你应该清除一些脏东西。 应用的入口就是 "main": "src/main.ts"。...在 @NgModule 装饰器中，我们有一个引导 bootstrap 数组，表明加载 AppComponent。...index.html 是服务器提供的挂载页面。 index.html 这个文件最终调用根组件，也就是 app-root ，这个组件在文件 app.component.ts 中被定义。...首先， index.html 是一直被渲染的。不管我们做什么，index.html 都是主要的模块。 标签里面的内容的更改是基于 URL的。...通过 app.component.html 模版文件（如下）路由出口 Router-outlet ，页面组件可以和 URL 一一对应，然后在 标签内渲染。
Angular 2 版本的 ng-bootstrap 初体验 最近 angular-ui 团队终于正式发布了基于 Angular 2 的 Bootstrap 界面库 ng-bootstrap ， 工作中一直用...index.html 文件也要修改一下， 把 bootstrap 的样式表关联进来： 修改 app.component.ts 还需要修改一下 app.component.ts 文件， 导入 ng-bootstrap 的指令： import { Component...AppComponent implements OnInit { ngOnInit() { } } ng-bootstrap 以指令 (directive) 的形式提供组件， 方便在 html 视图中使用...再来一个稍微复杂一点儿的， 在 app.component.ts 文件中添加下面的代码： export class AppComponent implements OnInit { alert
创建 Site 模型 以下创建了一个简单的模型类 Site，包含了三个必需字段：id，name，url，一个可选字段：alexa。...id: number, public name: string, public url: string, public alexa?...因为模板驱动的表单有它们自己的模块，所以我们得把 FormsModule 添加到本应用的 imports 数组中，这样我们才能使用表单。...app/app.component.ts 文件： import { Component } from '@angular/core'; @Component({ selector: 'my-app...在 angular-forms 目录下输入以下命令： cnpm install bootstrap --save 打开 index.html 文件，把以下样式链接添加到 中： <link
首先，我们主要的工作目录是src目录，开发的90%以上的工作量都集中在这个目录上，在里面就是用angular2或以上的技术去书写html模版、样式和脚本（有面向对象开发经验的很容易上手），开发完成后通过...ionic的命令行生成为原始的静态html页面，并存放在www目录（见上图所示），也就是说www在开发过程中是不需要理的，可以任意删除。...然而，如果只是本地网页这么简单的话，它和在线网页的没啥区别，只是速度会快些而已，但作为混合式应用，调用原生功能是最基本的要求。...还是把它们抽出来作为配置项，直接改配置项，就自动覆盖到原生代码中去好？...另外它们的名字也是可变的，只是基于约定大于配置的概念，而且利用ionic-cli命令行生成文件，如ionic g pipe date会生成到上述默认文件夹名称中，所以建议保持一致。
Nginx中实现各种重定向，并针对特定用例进行一些示例。...在最简单的形式中，它至少需要两个参数：旧URL和新URL。 您可以在服务器配置中使用以下行实现临时重定向： server { . . ....在此示例中，我们从旧域domain1.com重定向到名为domain2.com的新域。我们将在此处使用永久重定向，因为旧域将被删除，并且所有流量应从现在开始进入新域。...在\^/(.\*)\$正则表达式后，匹配的一切在/之后的URL。例如，http://domain1.com/index.html将被重定向http://domain2.com/index.html。...只更改名称会导致尝试访问原始URL的访问者出现404 Not Found错误，但您可以通过使用重定向来避免这种情况。
前言： 上一篇文章我们讲了如何在创建的Angular项目中快速引入ng-zorro-antd企业中台组件库，并且快速构建后台管理页面框架模板。...模块和组件关系： 注意：一个模块可以有多个组件，一个组件也可以有多个样式表,但只有一个HTML模板。...修改项目默认调转页面，Angular应用多模块路由配置： 找到app-routing.module.ts文件，在【routes】对象中声明新模块路由，以及项目默认调转页面地址修改。 ?...2、配置首页组件路由（多模块路由完美解决）： 首先，我们的博客项目存在博客管理和用户管理两个核心模块，我们创建了两个模块，那么我们如何在【app-routing.module.ts】应用路由文件中配置多个模块的路由...自定义页面Layout布局（动态菜单栏配置）： 一般情况下我们的页面动态菜单都是从后台读取，然后遍历绑定在【app.component.html】页面中的，我们这里没有展示没有涉及到后台就是用固定式的路由
尽管在 Angular 模版绑定文档中提到了伪事件 pseudo-event，但是在其他地方没有进一步的文档说明。深入之前，我们看看 Angular 中的伪事件解决了什么问题。...如下，是一个关于怎么在模版中声明伪事件的例子： <input (keydown.esc) ='.....<em>在</em> @HostListener <em>中使</em>用 Pseudo-Events 如同其他 DOM 事件，你可以通过 @HostListener 监听伪事件： @HostListener('keydown.control.z...它们并不是 Angular 伪元素独有的。实际上，它们是 KeyboardEvent 小写的键属性。如果你想查键盘事件属性值完整的列表，请移步参考。...（如减号，等号，斜杆，左括号，右括号，反向号等）上仍然缺乏这种映射。
OIDC 允许你直接使用 Okta Platform API 进行认证，本文的目的就是告诉你如何在一个 Ionic 应用中使用这些 API。...另外，关于如何在后端的 Auth 服务中验证用户身份的文档也不多。...它们用于访问被保护的资源，通常是在发送请求时将它们添加到 Authentication 请求头中。...Nic Raboy 演示了在 Facebook 中的操作方法，他在 Ionic 2 移动 App 中使用了 OAuth 2.0 服务。...image.png 注意： 如果应用程序显示错误 "连接服务器失败 (file:///android/www/index.html)"，在 config.xml 中添加以下代码。
OIDC 允许你直接使用 Okta Platform API 进行认证，本文的目的就是告诉你如何在一个 Ionic 应用中使用这些 API。...另外，关于如何在后端的 Auth 服务中验证用户身份的文档也不多。...它们用于访问被保护的资源，通常是在发送请求时将它们添加到 Authentication 请求头中。...Nic Raboy 演示了在 Facebook 中的操作方法，他在 Ionic 2 移动 App 中使用了 OAuth 2.0 服务。...注意： 如果应用程序显示错误 "连接服务器失败 (file:///android/www/index.html)"，在 config.xml 中添加以下代码。
API经常公开其他开发人员可以在自己的应用程序中使用的数据，而不必担心数据库或编程语言的差异。 开发人员经常从API返回数据，该数据返回JSON格式的数据，并将其集成到前端应用程序中。...先决条件 在开始本教程之前，您需要以下内容： 支持JavaScript语法高亮显示的文本编辑器，如Atom ， Visual Studio Code或Sublime Text 。...熟悉JSON数据格式，您可以在JavaScript中了解如何使用JSON来了解更多信息。 熟悉向API发出请求。 有关使用API的综合教程，请参阅如何在Python3中使用Web API 。...我们将把这两个文件保存在同一个目录中。 首先，修改index.html文件并删除JavaScript代码，将其替换为vueApp.js文件的链接。...然后在与index.html文件相同的目录中创建vueApp.js文件。
但是，为了在本地检查 dist / 文件夹是否具有在远程Web服务器上运行应用程序所需的一切，请使用本地Web服务器亲自进行尝试： npx http-server dist 它应该输出一个URL，您可以在浏览器中访问它...这将意味着我们自动生成的 dist / bundle.js 文件将被删除（好），而我们手动实现的 dist / index.html 文件将被删除（不好）。...这意味着我们可以在每个Webpack版本中删除 dist / 文件夹中的内容。...您的Webpack配置将复制它们，以使其在您的源代码中可访问（请参阅上一节）。...让我们看看如何在 build-utils / webpack.config.js 文件中使用它们： const { merge } = require('webpack-merge'); const
to=https%3A%2F%2Fgithub.com%2Findexzero%2Fhttp- server)亲自进行尝试： npx http-server dist 它应该输出一个URL，您可以在浏览器中访问它...这将意味着我们自动生成的 dist / bundle.js 文件将被删除（好），而我们手动实现的 dist / index.html 文件将被删除（不好）。...这意味着我们可以在每个Webpack版本中删除 dist / 文件夹中的内容。为此，请引入[clean-webpack- plugin插件](https://links.jianshu.com/go?...您的Webpack配置将复制它们，以使其在您的源代码中可访问（请参阅上一节）。...让我们看看如何在 build-utils / webpack.config.js 文件中使用它们： const { merge } = require('webpack-merge'); const commonConfig
第四步：编辑你的第一个 Angular 组件 组件 是 Angular 应用中的基本构造块。 它们在屏幕上显示数据、监听用户输入，并根据这些输入采取行动。...当工作空间文件结构到位时，可以在命令行中使用 ng generate 命令往该应用中添加功能和数据。这个初始的根应用是 CLI 命令的默认应用（除非你在创建其它应用之后更改了默认值）。...用 JIT 编译器编译应用，然后引导应用的根模块（AppModule）在浏览器中运行。...在您的 app.component.ts中使用全局变量VERSION： import { Component } from '@angular/core'; declare const VERSION...默认值的数据类型为 字符串，默认值为 async，但推荐用 all。它表示将哪种类型的模块分离成新文件。
> 在模板中，我们使用了{{ url_for('resume') }}来动态生成指向resume路由的URL。...在Flask中，你可以将静态文件放在项目的static文件夹中，然后通过特定的URL来访问它们。...不过，我仍然可以为你解释如何在 Flask 应用中结合使用openpyxl和 Flask 的路由、模板渲染及静态文件处理功能。 1....Flask 路由 在 Flask 中，路由是通过装饰器@app.route()定义的。这个装饰器将 URL 映射到特定的视图函数。...这些文件与openpyxl没有直接关联，但你可以使用 Flask 的url_for函数来在模板中引用它们。
本文中你将学习两种在Linux中使用命令行下载文件的方法。我在这里使用的是Ubuntu，但除了安装之外，其余的命令同样适用于所有其他Linux发行版。...wget URL 要下载多个文件，您必须将它们的URL保存在一个文本文件中，并提供该文本文件作为wget的输入，如下所示： wget -i download_files.txt 3、使用wget下载名称不同的文件...您会注意到，网页几乎总是以index.html的形式保存在wget中。...要在Linux终端中使用curl命令下载文件，必须使用-O(大写O)选项： curl -O URL 在Linux中，用curl下载多个文件是比较简单的。...您只需要指定多个URL： curl -O URL1 URL2 URL3 请记住，curl不像wget那么简单。当wget将网页保存为index.html时，curl会抱怨远程文件没有网页名称。
jsx 和 scss 中使用图片 React + webpack 开发单页面应用简明中文文档教程（十一）将项目打包到子目录运行 ---- 在上一篇博文中，我们已经运行起来了我们的项目。...public 静态文件目录说明 ├── favicon.ico # 标签栏图标文件，找设计做一个替换 ├── index.html # 入口 index.html 文件...修改 index.html 文件 我这边以移动端为例，PC端项目请参考后自行调整 <!...我这里主要是演示，如何在入口文件中引入静态文件中的 js 文件。 经过了这些调整，我们的项目应该是跑不起来的。因为我们的 src 目录中的文件并没有配置完成。...不过为避免博文太长，不便阅读，我们下一篇再讲 src 中的文件内容。 本文由 FungLeo 原创，允许转载，但转载必须保留首发链接。
在本教程的最后，将向大家展示如何在新创建的应用程序上添加 Material Dashboard React。 在我们开始之前，请确保你的电脑上安装了 npm 和 Nodejs 的最新版本。...JS 文件中添加React代码，Webpack 会给我们一个错误，它不知道如何在bundle.js 文件中编译 React。...它的作用是在 node 环境中，直接运行 es2015 的代码，而不需要额外进行转码。例如我们有一个 js 文件以 es2015 的语法进行编写(如使用了箭头函数)。...npmjs.com 上找到它们的详细信息和它们自己的文档。...再一次，进入 package.json 文件并从我们刚刚安装的安装包中删除（^）。
在本教程中，我们将讨论如何在Ubuntu 16.04服务器上配置Nginx中的服务器块。 准备 在本教程中，我们将使用具有sudo权限的的非root用户。 您还需要在服务器上安装Nginx。...它被配置为在/var/www/html中的目录之外提供文档。 虽然这适用于单个站点，但如果我们要为多个站点提供服务，我们还需要其他目录。...我们将在每个站点内用/var/www创建一个目录结构。实际的Web内容将放在这些特定于站点的目录中的目录html中。...在第一个域中创建一个index.html文件： nano /var/www/example.com/html/index.html 在文件中，我们将创建一个非常基本的文件，指示我们当前访问的网站。...在本教程中，我们将保留默认服务器块以提供不匹配的请求，因此我们将default_server从此服务器块和下一个服务器块中删除它们。您可以选择将选项添加到对您有意义的服务器块中。
/index.html app.js将包含我们应用程序的所有逻辑，index.html 文件将包含我们应用程序的主视图。 我们先在 index.html 中写一些基本的标记: <!...计算的属性也是基于它们的依赖关系缓存的，所以只要results不变，processedPosts属性返回一个自己的缓存版本。这将有助于提升性能，特别是在进行复杂的数据操作时。...接下来，我们在index.html中编辑我们的html来显示我们的计算结果：
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储
