在迭代ngfor指令时，是否可以拆分字符串并将其显示在angular 2中
在迭代ngFor指令时，可以拆分字符串并将其显示在Angular 2中。
首先，ngFor是Angular中的一个内置指令，用于在模板中循环遍历数组或对象的元素。当我们有一个字符串需要拆分并显示时，可以先将字符串拆分成一个数组，然后使用ngFor指令来遍历这个数组并显示每个拆分后的元素。
下面是一个示例代码：
在组件中定义一个字符串变量：
str: string = "Hello World";在模板中使用ngFor指令来拆分字符串并显示：
<div *ngFor="let char of str.split('')">{{ char }}</div>在上述代码中，我们使用split('')方法将字符串拆分成一个字符数组，然后使用ngFor指令遍历这个数组，并在每次迭代中显示字符。
这样，当页面渲染时，字符串"Hello World"会被拆分成一个字符数组，并依次显示在页面上。
对于这个问题，腾讯云提供的相关产品是腾讯云云服务器（CVM）。腾讯云云服务器是一种弹性计算服务，提供了可靠、安全、灵活的云计算能力，适用于各种场景和工作负载。您可以通过腾讯云云服务器来搭建和部署Angular应用程序，并使用ngFor指令来实现字符串拆分和显示。
更多关于腾讯云云服务器的信息和产品介绍，请访问以下链接： 腾讯云云服务器产品介绍：https://cloud.tencent.com/product/cvm 腾讯云云服务器文档：https://cloud.tencent.com/document/product/213
相关·内容
我试图在迭代ngfor指令时拆分字符串。这是我的代码 <div class="col-lg-3 col-md</div>
浏览 16提问于2018-02-14得票数 1
回答已采纳
2回答
我对angular是个新手。我正在尝试在组件中呈现一些来自服务器的动态模板字符串。目前，我已经写了一个脚本，通过使用.split('{{')等来获取templateString和obj并返回属性。在angular中有没有更简单的内置方法来做到这一点？例如，动态编译onChanges或onInit模板字符串，这样我就可以利用ngFor来显示数组属性中的值。}}</p>'
浏览 52提问于2020-02-25得票数 2
3回答
我尝试在角度2中循环数组中的每个对象。input type="button" (click)="addAnnouncement(newAnnouncement)">
</section><ul> {{Announcement.title}}
{{Announcement.descript
浏览 2提问于2017-02-12得票数 3
我是Angular的新手，我只是想知道是否可以在不使用let项的情况下使用ngFor指令；让i= index语法 在使用ngFor迭代数组时，有没有其他方法可以获得索引 我的示例应用程序 <div *ngFor="let oddNumber of oddNumbers; let i = index">
<app-odd *ngIf=&qu
浏览 34提问于2020-08-29得票数 0
6回答
我试图让ngFor迭代一个数组。意识到它没有做任何我输入的东西。<p ngFor="let applier of tempAahsbdkasjbdnpplicants">{{applier}}</p>
这显然是非常错误的不返回任何错误。有人有线索吗？
浏览 6提问于2017-04-13得票数 1
回答已采纳
我尝试在模板中使用*ngFor迭代数组，并使用*ngIf根据键搜索元素。现在，当条件与密钥匹配时，我想要中断*ngFor。我想知道angular2中是否有任何选项可以根据条件中断ngFor循环。
浏览 1提问于2016-10-07得票数 13
回答已采纳
3回答
我有一个小应用程序，在其中我收到一个问题，其中有一些隐藏的单词要写下来，如下所示：当接收到此字符串时，必须将每个{x}字符串替换为用户将用正确答案填充的输入因此，我创建了以下代码：<div *ngFor="let question of questionsArray"> <divinnerHtml);我还在构造函数中添加了DomSanitizer
浏览 50提问于2019-06-03得票数 0
回答已采纳
2回答
我正在迭代一个字符串数组(称为单词)，并希望为每个单词创建span元素，并使用Angular/Typescript为行尾字符(\n)创建br元素。我已经让ngFor指令正常工作了： <span *ngFor="let word of words注意:在解析文档时</
浏览 4提问于2019-02-20得票数 3
section<b></p>", "button3":"<p><b>third section<b></p>",在我的如果单击按钮1，则需要使用如下代码显示其数据：
document.getElementById("c1").inn
浏览 0提问于2018-01-27得票数 1
回答已采纳
2回答
如何在模板中调用服务的方法来创建一个动态表或其他应该是动态HTML的东西？我尝试使用{{anyservice.getDynamicTable(param)}}的双曲括号，但这不起作用。正确做到这一点的方法是什么？
浏览 1提问于2016-10-24得票数 0
回答已采纳
我对Angular是个新手。我在表中有一个绑定到值item.md_id的行，如下所示： <td class="align-right" id="md_id
浏览 0提问于2018-04-19得票数 0
我在Angular中有一个组件，它有一个作为数字的输入，因为它根据列表中的偶数或奇数呈现不同的值。但我只想将一个值传递给组件，然后忘记它，但它似乎更喜欢Angular函数，因为输入没有副作用。该函数的好处是我可以更改组件的顺序，而不必担心重新组织硬编码的数字。
浏览 3提问于2019-05-05得票数 0
使用ngFor -角4时发生错误正在显示数据，但仍会显示此错误。this.service.getEmpresas().subscribe((res) => { })模板
<tr *ngForNgFor只支持绑定到诸如数组之类的Iterable。NgForOf.webpackJs
浏览 11提问于2017-09-07得票数 1
回答已采纳
2回答
我正在动态地获取一个字符串列表，并使用ngFor将其显示在angular中。但在显示时，某些字符串包含的超链接很少，但它们显示为普通字符串。我想要区分像下划线的超链接。
浏览 15提问于2020-06-11得票数 0
2回答
我正在处理一个angular2项目，该项目使用新的可观察框架异步地从api中获取一个对象。 );
当我们试图使用内插{AccountDetails.UserName}访问该对象的属性时，--它只会在内插代码中显示一个空值。这是Angular2的变化吗？另外，我注意到，当我们在代码中使用*ngFor迭代对象的属性时，如果对象尚未从api中接收
浏览 6提问于2016-09-07得票数 1
回答已采纳
在迭代可观察对象时，我遇到了这个错误。我知道它正在考虑将getNumbers方法的返回值作为对象而不是数组。但是，我不希望处理数据并创建数组，然后将其传递给视图。我希望它是可观察的数字数组，并使用此数组与ngFor和异步来显示每个元素。请让我知道如何实现这一点。以下是代码 import { Injectable } from '@angular/core';
import { Observable, fr
浏览 20提问于2019-07-03得票数 0
回答已采纳
1回答
我有一个自定义的Angular指令，它接受几个输入。它的目的是使用输入matchTerm突出显示添加了指令的元素的匹配部分。它应该与typeahead结果列表一起工作，所以当用户键入时，返回的结果会突出显示匹配的字符串。，变量的值都不会显示在屏幕上：为了防止在li元素上使用structural *ngFor指令，我尝试将ngFor放在ng-template标记上，但仍然
浏览 1提问于2019-05-14得票数 0
在Angular 6中，我使用FormBuilder创建了如下表单： formData = this.formBuilder.group({ listSubItem: this.formBuilder.array([], ValidationService.noDuplicateSubItemName),
}); 在表单中
浏览 13提问于2019-05-24得票数 0
1回答
我正在开发一个angular5应用程序。我有一个包含问题列表的数组，并通过使用ngFor.User迭代来显示它，可以通过按Ctrl键选择他选择的问题。在通过按下ctrl键选择一个将显示为选中的问题后(我实现了将该问题添加到一个数组中，并在迭代时检查永久问题是否在该数组中存在的selectedQuestions array.If中，我添加了一个“活动”类以将其<em
浏览 9提问于2018-01-29得票数 2
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
即时通信 IM
对象存储活动推荐
腾讯云开发者
