首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

how to fix this symbol‘在angular 2应用程序中显示为&#39

在Angular 2应用程序中,如果一个符号显示为',这意味着它被HTML实体编码了。'代表单引号字符。

要解决这个问题,你可以使用Angular的内置的HTML解码器来将实体编码的符号转换回原始字符。可以通过使用[innerHTML]属性和DomSanitizer服务来实现。

首先,在组件的模板中,使用[innerHTML]属性来显示包含实体编码的符号的文本。例如:

代码语言:html
复制
<div [innerHTML]="'&#39;'"></div>

然后,在组件的代码中,注入DomSanitizer服务,并使用bypassSecurityTrustHtml方法来解码实体编码的符号。例如:

代码语言:typescript
复制
import { Component } from '@angular/core';
import { DomSanitizer } from '@angular/platform-browser';

@Component({
  selector: 'app-example',
  template: '<div [innerHTML]="decodedSymbol"></div>'
})
export class ExampleComponent {
  decodedSymbol: any;

  constructor(private sanitizer: DomSanitizer) {
    this.decodedSymbol = this.sanitizer.bypassSecurityTrustHtml('&#39;');
  }
}

这样,&#39;将被正确地显示为单引号字符。

页面内容是否对你有帮助?
有帮助
没帮助

相关·内容

【优化】记一次通过工具减少 Git 冲突

接下来,我用 vue-cli 演示下 时机——pre-commit: git commit 之前,可以使用 git hooks 做到 package.json 中加入如下代码,意思是 git commit...它俩功能是一样的,都是生成一些 git hooks 文件,读取项目中package.json 的相关配置项去执行一些命令,区别是尤大做了一些逻辑和配置上的改动 读取和排序:寻找指定目录下的文件(下面示例...the problem in the auto-fix/index.js directory`) } 结果 Gif 演示一下,可以看到 git commit 的时候,就会自动排序 ?...可以实验一下 let obj = { [Symbol()]:0, b:0, 10:0, 2:0, a:0 }; // for...in循环遍历对象自身的和继承的可枚举属性(不含 Symbol 属性) /...其次遍历所有字符串键,按照加入时间升序排列 最后遍历所有 Symbol 键,按照加入时间升序排列 回顾实现——也存在类似问题 上面的实现,我是先根据属性的 value 值排序,如果 value 值相同再根据

97930

AngularDart4.0 英雄之旅-教程-03英雄编辑器

', 刷新浏览器,页面将显示标题和英雄名 双大括号是Angular插值绑定语法。 这些插值绑定将组件的标题和英雄属性值作为字符串显示HTML标题标签内。...类,将组件的英雄属性重构Hero类型,然后将其id初始化为1,nameWindstorm。...', 刷新浏览器,页面将显示英雄名 组合HTML和多行模板字符串 要显示所有英雄的属性,请英雄的id属性添加一个,并为英雄的名称添加另一个。...模板中使用任何Angular指令之前,需要在组件的@Component注解的指令参数列出它们。...刷新浏览器,应用程序应该会再次工作。 您可以编辑英雄的名字,并看到立即在文本框上方的反映的更改。

3.2K10
  • CA1031:不要捕捉一般异常类型

    如何解决冲突 若要解决此规则的冲突,请捕捉更具体的异常,或者执行 catch 块的最后一条语句时重新引发一般异常。 何时禁止显示警告 不禁止显示此规则发出的警告。...如果要在 .NET Framework 4 或更高版本编译某个应用程序,并保留对损坏状态异常的处理,则可将 HandleProcessCorruptedStateExceptionsAttribute...不允许的异常类型名称 你可以仅为此规则、所有规则或为此类别的所有规则配置此选项(设计)。 有关详细信息,请参阅代码质量规则配置选项。 不允许的异常类型名称 可配置不允许捕捉哪些异常类型。...dotnet_code_quality.CA1031.disallowed_symbol_names = ExceptionType1|ExceptionType2 匹配编译名为“ExceptionType1...”和“ExceptionType2”的类型与各自的完全限定名称进行匹配 你可以仅为此规则、所有规则或为此类别(设计)的所有规则配置这些选项。

    45930

    详解FIX协议的原理、消息格式及配置开发

    监控序列号可以使会话参与者识别和处理丢失的消息,当在一个FIX会话重新连接时能够快速进行应用程序同步。 每个会话将建立一组互不依赖的接受和发送序列。...心跳 消息交互期间,FIX应用程序将周期性产生Heartbeat心跳消息。该心跳消息可以监控通信链路状态及识别接收序列号间隙。...然而,一些显示的标志域必须采用明文进行传输。确保完整性,明文域可以SecureData域中重复。 当使用加密时,建议但不是必须,所有的消息体都进行加密。...如果一个消息的重复组数据的部分数据要加密,这个重复组必须全部进行加密。 预先协商好的加密算法Logon消息中进行声明。 自定义域 FIX给用户提供最大的灵活性,FIX协议允许用户自定义域。...例如:1 = Buy,2 = Sell | | 55 | Symbol | 股票代码。

    8K41

    如何在 Windows 上安装 AngularAngular CLI、Node.js 和构建工具指南

    Angular CLI, Node.js, and Build Tools,作者Ahmed Bouchefra 本教程,我们将学习如何在 Windows 安装 Angular CLI 并使用它来创建...本例,Node.js 用于构建应用程序的后端部分,并且可以替换为您想要的任何服务器端技术,例如 PHP、Ruby 或 Python。...您可以通过命令提示符运行以下命令来确保系统上安装了 Node,该命令应显示已安装的 Node 版本: $ node -v 接下来,运行以下命令来安装 Angular CLI: $ npm install...e2e (e): 构建并提供 Angular 应用程序,然后使用 Protractor 运行端到端测试。 generate (g): 根据原理图生成和/或修改文件。...因此,您不需要安装本地服务器来您的项目提供服务 —您可以简单地从终端使用 ng serve 命令本地您的项目提供服务。

    47100

    构建具有用户身份认证的 Ionic 应用

    Ionic 2 一月份发布, 可以使用 Angular 开发 Ionic 应用。 Ionic 3 四月份发布,允许使用 Angular 4 进行开发。...你可以使用 Chrome 的设备模式查看应用程序 iPhone 6 的效果。 ? 使用 Ionic serve 命令的特点是它会在浏览器显示编译错误,而不是(有时会隐藏)开发控制台。...如果你是第一次做,Xcode 可能会加载一段时间,上方会显示一条 "Processing symbol files" 的信息。...安装过程,它会提示你将 Android SDK 安装到哪里。将这个路径设置 ANDROID_HOME 的环境变量。...image.png 注意: 如果应用程序显示错误 "连接服务器失败 (file:///android/www/index.html)", config.xml 添加以下代码。

    23.2K50

    构建具有用户身份认证的 Ionic 应用

    Ionic 2 一月份发布, 可以使用 Angular 开发 Ionic 应用。 Ionic 3 四月份发布,允许使用 Angular 4 进行开发。...你可以使用 Chrome 的设备模式查看应用程序 iPhone 6 的效果。 ? 使用 Ionic serve 命令的特点是它会在浏览器显示编译错误,而不是(有时会隐藏)开发控制台。...如果你是第一次做,Xcode 可能会加载一段时间,上方会显示一条 "Processing symbol files" 的信息。...安装过程,它会提示你将 Android SDK 安装到哪里。将这个路径设置 ANDROID_HOME 的环境变量。...注意: 如果应用程序显示错误 "连接服务器失败 (file:///android/www/index.html)", config.xml 添加以下代码。

    23.8K00

    【17】进大厂必须掌握的面试题-50个Angular面试

    Angular,什么是字符串插值? Angular的字符串插值是一种特殊的语法,它在双花括号 {{}}中使用模板表达式来显示组件数据。它也称为小胡子语法。...通常,Angular,此转换是从TypeScript到JavaScript的。这是一个隐式过程,在内部发生。 34. How to perform animation in Angular?...基本上,它们是Angular创建服务的三种方式: Factory Service Provider 39.什么是单例模式,Angular可以找到它?...当Angular找到ng-app指令时,它将加载与其关联的模块,然后编译DOM。 手动引导: 手动引导您提供了有关如何以及何时初始化Angular应用程序的更多控制。...48.Angular解释ng-app指令。 ng-app指令用于定义Angular应用程序,使我们可以Angular应用程序中使用自动引导。

    41.4K51

    Design issues - Sending small data segments over TCP with Winsock

    如果要收到第二个数据数据包并延迟计时器过期前该 ACK 相同的方向发送的数据 ACK 是此用数据段,立即发送。 200ms延迟计时器过期时, 将确认发送。...大多数时候,send只是表示数据被拷贝到系统缓冲区而不是发送出去了。唯一的例外就是你通过设置SO_SNDBUF 0禁用了Winsock buffering 。...communication with a fix-sized header containing the number of records to follow....2,应用层自己合并数据,不要发太多的小包。...2,如果可能,避免使用单向数据流套接字连接。单向套接字更容易受Nagle 和DelayACK的影响。 3,如果所有的小包都要立刻发送,发送方使用TCP_NODELAY 。

    43920

    你可能已经忽略的git commit规范

    引言 日常的开发工作,我们通常使用 git 来管理代码,当我们对代码进行某项改动后,都可以通过 git commit 来对代码进行提交。...但是日常工作,大多数同学对于 log 信息都是简单写写,没有很好的重视,这对于项目的管理和维护来说,无疑是不友好的。...不过社区也我们提供了一些辅助工具来帮助进行提交,下面来简单介绍一下这些工具。 commitizen(cz-cli) commitizen是一款可以交互式建立提交信息的工具。...可以 git hook 的各个阶段执行我们 package.json 配置好的 npm script。...首先安装 husky: npm install --save-dev husky 接着 package.json 配置 commitmsg 脚本: "husky": { "hooks": {

    2.3K30

    9个不错的前端开源项目

    为了帮助你2020年成前端大师,我收集了9个不同的项目,每个项目都有不同的主题和不同的JavaScript框架或库作为技术栈,您可以构建它们并将它们添加到学习计划。...1.使用React(带hook)构建电影搜索应用程序 首先,您可以使用React构建电影搜索应用程序。下图显示了最终应用的外观: ?...技术栈和功能 React Hook create-react-app JSX CSS 不使用任何类的情况下,这个项目你提供了一个完美的入门到实战的机会,并且肯定会在2020年您提供帮助。...https://www.freecodecamp.org/news/how-to-build-a-movie-search-app-using-react-hooks-24eb72ddfaf7/ 2.使用...您将学到什么 本教程,您将学习如何利用Gatsby构建出色的博客,以便在使用React和GraphQL的同时编写自己的文章。

    6.9K30

    ng 核心模块

    angular.forEach obj集合的每个项执行iterator函数,obj可以是一个对象或者是数组。...angular.toJson 序列化对象JSON格式的字符串。属性如果以$$开头,则会被排除,因为angular内部使用这个标记。 angular.fromJson 反序列化JSON字符串对象。...使用Angular标记类似于{{hash}}一个href属性,如果点击的时机早于Angular替换{{hash}}标记将导致连接到错误的URL。...使用Angular 标记例如{{hash}}一个src属性不能正确工作:浏览器将从带有{{hash}}的URL获取资源直到Angular替换了这个表达式。使用ngSrc指令可以解决这个问题。...使用Angular 标记例如{{hash}}一个srcset属性不能正确工作:浏览器将从带有{{hash}}的URL获取资源直到Angular替换了这个表达式。

    1.2K10

    ECMAScript 装饰器的 10 年

    虽然使用React构建的应用程序,高阶组件(HOC)的使用变得不太常见,但HOC仍然是装饰器使用的一个良好而且广为人知的例子。...相反, JavaScript ,一切都是以最终用户考量而设计的,这是其他编程语言无法夸耀的地方。如今,JavaScript 不仅仅是一种浏览器语言。它可以各种环境运行,包括服务器端。...这 TC39 委员会带来了额外的挑战,因为他们不得不考虑开发者社区的期望和要求以及语言引擎的优化问题。2016-07 – 阶段 2。在装饰器提案达到第二阶段后,其 API 开始经历重大变化。...“请注意,ES装饰器尚未得到支持,但我们将努力未来版本默认启用它们。”2023年5月 - Angular v16发布。Angular 16还增加了对ECMAScript装饰器的支持。...然而,如果您通过使用原生语法来帮助引擎,那么大多数情况下,您的应用代码通常会运行得更快。可能的扩展规范的新语法也将来引入其他功能打开了大门。打个比方,考虑一下构造函数和类。

    9810

    (译)通过 Git 和 Angular 了解语义化提交信息

    约定式提交就是这样一种规范,它在实践简化了 Angular 约定,并简化指出了提交消息规范的要点。...话虽如此,我们的一些人可能不接受这些消息约定,认为它们是可读的或提供信息的,这显然是有意义的。所以如果我们也不需要这些附带的好处,那项目中执行这样的规范显然是没有意义的。...让我们以上述的例子例,并添加一个主体: git commit -m "fix(core): remove deprecated and defunct wtf* apis" -m "These apis...正如您可能会推断的,此提交实际上是 Angular 存储库存在的。 常见类型 除了定义提交消息格式外,Angular 的提交消息约定还指定了一个有用的类型列表,其中包含了各种各样的更改。...让我们看看这些约定是如何简化我们对这些记录的浏览: git log --oneline --grep "^feat\|^fix\|^perf" 我们使用提交消息类型来过滤,因此只显示生产更改(所有以 feat

    1.4K20
    领券