DevExtreme初级入门教程(Angular篇):应用程序模板(Part 5)——验证 & 创建一个空应用

翻译|使用教程|编辑:龚雪|2021-09-13 09:52:23.003|阅读 34 次

概述:可直接利用DevExtreme Angular应用程序模板快速创建一个简单的Angular应用程序,本文主要介绍如何验证 & 创建一个空应用等。

# 31款JAVA开发必备控件和工具 # 开发软/控件产品年终优惠

相关链接:

DevExtreme v21.1.5最新版下载

验证

DevExtreme Angular应用程序包括身份验证 UI 和 API,配置客户端路由,以便未经身份验证的用户只能导航到身份验证页面,这些页面允许用户登录、创建新帐户或重置密码。

身份验证页面由 UnauthenticatedContentComponent 呈现。

重要提示:不要依赖客户端路由来保护您的应用程序免受未经授权的访问,始终在后端验证用户凭据。

与后端集成

用于后端请求的存根认证功能在 AuthService 中实现,更新这些函数以向您的后端发出实际请求。

每个函数都返回一个具有以下字段的对象:

获取用户信息

用户信息由同一个 AuthService 提供,您可以使用其 getUser() 方法来访问此信息:

TypeScript

import { Component } from '@angular/core';
import { AuthService } from './shared/services';

@Component({
// ...
})
export class AppComponent {
constructor(private authService: AuthService) { }

ngOnInit() {
this.authService.getUser().then((e) => {
if (e.data) {
// User is authenticated
...
}
});
}
}

创建一个空的应用程序

要生成没有视图和导航菜单的应用程序,请使用 --empty 标志:

npx devextreme-cli new angular-app app-name --empty

支持Internet Explorer 11

要使生成的应用程序在 Internet Explorer 11 中工作,请执行以下操作:

1. 安装并启用 polyfill

npm install --save classlist.js core-js

code-type active

// ...
import 'core-js/es/array';
import 'classlist.js';
// ...

2. 包含 IE 11 作为受支持的浏览器,打开 .browserslistrc 文件,不要将 IE 11 更改为 IE 11。

3. 修改启动和构建命令

package.json

{
// ...
"scripts": {
// ...
// "start": "ng serve",
// "build": "ng build",
"start": "node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng serve --prod",
"build": "node --max_old_space_size=4096 node_modules/@angular/cli/bin/ng build --prod",
// ...
}
}

4. 降低目标 ECMAScript 版本

{
// ...
// "target": "es2015",
"target": "es5",
// ...
}

DevExtreme | 下载试用

DevExtreme拥有高性能的HTML5 / JavaScript小部件集合,使您可以利用现代Web开发堆栈(包括React,Angular,ASP.NET Core,jQuery,Knockout等)构建交互式的Web应用程序。从Angular和Reac,到ASP.NET Core或Vue,DevExtreme包含全面的高性能和响应式UI小部件集合,可在传统Web和下一代移动应用程序中使用。 该套件附带功能齐全的数据网格、交互式图表小部件、数据编辑器等。


DevExpress技术交流群4:715863792      欢迎一起进群讨论

更多DevExpress线上公开课、中文教程资讯请上中文网获取

DevExpress 增值服务火热销售中

标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至hey@evget.com

文章转载自:慧都网

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
相关产品
DevExtreme Complete Subscription

高性能HTML5/JavaScript开发框架,利用现代Web开发堆栈构建优异性能的应用程序。

DevExpress Universal Subscription

行业领先的界面控件开发包,帮助企业构建卓越应用!

title
在线咨询
联系我们
TOP
在线客服系统
live chat