Question

我试图将文本作为值访问。目前，我能够检索值，但不能检索文本。

<select id="firstName" formControlName="firstName" class="form-control">
  <option value="Not Selected" [disabled]="true" [selected]="true">Select</option>
  <option *ngFor="let fName of clientFileData.worksheets[0].columns" value={{fName.index}}>{{fName.name}}</option>
</select>

使用this.firstName.value我能够获得fName.index的值，但我还想访问fName.name。如何在jquery中检索$("#firstName:selected").text();的等价值？

Answer 1

我已经尝试过这段代码并且它适用于我在html中尝试使用此代码在

上

    GridView Project_Details = e.Row.FindControlRecursive("Project_Details") as GridView;  //find the gridview tier2


    GridView Demande_Ponctuelle = Gridview.FindControlRecursive("Demande_Ponctuelle") as GridView; //Find the gridview tier3

和ts文件

<select id="firstName" formControlName="firstName" (change)="getName($event)"
 class="form-control">

让我知道你是否适合你

Answer 2

为什么不用fName而不是{{fName.index}}绑定值？这样做会给你整个对象，然后你可以在里面找到name属性。但是，在Angular中，您可以使用@ViewChild来实现与$("#firstName:selected").text();

类似的内容

Answer 3

我不确定一种简单的方法，但您可能会遇到(change)事件，您可以使用fName.index遍历clientFileData数组并查找等效名称。

Answer 4

简单。您需要浏览正在渲染的选项列表，按ID查找所选选项并从中获取文本。这就是HTML select的工作方式：I only give you id of the selected item, so, if you want its text then go figure it out yourself，无论是使用选定索引属性还是其他东西的jquery或普通javascript。顺便说一下，我确信jquery在幕后做了类似的事情。

也可以将角度绑定作为模型而不仅仅是它们的ID来处理整个对象。这样，您就可以直接从选择绑定的模型中获取文本。但是，这将要求您提供自定义值访问器，可能还需要其他一些东西。起初听起来可能很吓人，但它不应该很复杂。

Answer 5

我刚刚找到了一个简单的解决方案，虽然只有在选项列表不包含可用于我的情况的逗号时才有效。

<select id="firstName" formControlName="firstName" class="form-control">
  <option value="Not Selected" [disabled]="true" [selected]="true">Select</option>
  <option *ngFor="let fName of clientFileData.worksheets[0].columns" value={{fName.index}},{{fName.name}}>{{fName.name}}</option>
</select>

这将返回字符串中带有name的索引。例如："1,John Doe"。

然后我们可以使用split方法操作逗号分隔的字符串。

console.log('Index: ' + this.firstName.value.split(',')[0]);
console.log('Name: ' + this.firstName.value.split(',')[1]);

如何在Angular

5 个答案: