Question

以下反应形式中有一个选择选项。 post.id将允许访问单个post.name的ID。
因此，假设用户从选项中选择第二个选项，那么post.id将为2。我要在用户提交表单时发送此ID。

我有另一种方法，当用户提交表单时，然后在contactForm.control.value对象中，我得到用户选择的选项的名称，然后在对象数组{中搜索相应的id {1}}。我想知道是否还有另一种方法可以不必搜索。

HTML文件

this.posts

TS文件

 <form [formGroup]="contactForm" (ngSubmit)="onSubmit()" class="apply-form">
   <select formControlName="post">
     <option ngFor="let post of posts" value="{{post.name}}">
     {{post.name}}
     <option>
     </select>
 <button>Submit</button>
 </form>

Answer 1

您的代码中遗漏了很多东西，但是让我给您提供获取数据的选项：

如果帖子仅包含ID和名称：

case USER.LOGIN_REQUEST:
        console.log(state)
        initialState.userIsLogging = action.payload
        return {
           ...state,
           userIsLogging: action.payload,
        }

您的按钮是一个普通按钮，应提交其类型以发布数据：

<option ngFor="let post of posts" value="{{post}}">

如果要从页面发送数据，则

<button type='submit'>Submit</button>

如果您想在onSubmit方法中读取值，则

// In HTML
(ngSubmit)="onSubmit(contactForm.value)"
 // Add signature to your onSubmit method
 onSubmit(data){....}

希望这会有所帮助！

将数据从html模板传递到组件打字稿文件

1 个答案: