Question

我有以下格式的json。

当我选择一个选项时，我想将值（json中的代码和描述值）传递给组件。

nameList= [
  {
    "code": "1",
    "description": "abc"
  },
  {
    "code": "123",
    "description": "def"
  },
  {
    "code": "100",
    "description": "ijk"
  }
]

HTML

<select [(ngModel)]="description" #category="ngModel" aria-required
 (change)="getNameList()"> //want to send data.code value to component
    <option style="display:none"></option>
    <option *ngFor="let data of nameList"> {{data.description}} 
    </option>
</select>

Demo

Answer 1

您应该使用 <Component Id="ChromeExt" Location="local" Guid="GUID_HERE"> <CreateFolder/> <File Id="ChromeExtension" Name="myextension-0.1.0.2.zip" Source="$(var.ChromeTargetDir)myextension-0.1.0.2.zip" KeyPath="yes"/> </Component>

<field>C:\Users\me\source\repos\mysolution\Extensions\artifacts\chrome\myextension-0.1.0.2.zip</field>

并在组件中访问为

[ngValue]="data"

WORKING STACKBLITZ DEMO

Answer 2

您应该尝试使用界面来改进打字稿代码您的html可能是这样

<hello name="{{exampleSelected?.description}}"></hello>

<select [(ngModel)]="exampleSelected" aria-required (change)="getNameList()">
    <option style="display:none"></option>
    <option *ngFor="let data of nameList" [ngValue]="data"> {{data.description}} 
 </option>
</select>

您的ts应该是这样的：

import { Component } from '@angular/core';


@Component({
  selector: 'my-app',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})


export class AppComponent {
  exampleSelected;

  nameList = [
    {
      "code": "1",
      "description": "abc"
    },
    {
      "code": "1",
      "description": "def"
    },
    {
      "code": "1",
      "description": "ijk"
    }
  ]

  getNameList() {
    console.log(this.exampleSelected);
  }
}

如何将数据从选定的选项发送到组件

2 个答案: