小编R.K*_*R.K的帖子

如何有条件地要求角4的表格输入?

我使用模板驱动的表单来添加任务,并且有两个输入字段的类型编号用于完成任务的估计分钟,

  • 一个字段用于估计的小时数和小时数
  • 另一个是用于完成任务的估计分钟数

因为任务估计可以在几个小时内完成,例如1小时,或小时和分钟,如1Hrs 30分钟,所以我想有条件地设置输入所需的属性.因此,如果在提交表单时两个输入都为空,则必须设置2个输入中的一个或表单验证错误.

到目前为止,我已经这样做但验证不起作用

<form class="add-task" (ngSubmit)="onSubmit(newtask)" #newtask="ngForm">  
    <div class="estimate-container">
        <input 
            type="number" 
            min="0" 
            max="10" 
            id="estimate_hrs" 
            ngModel 
            name="estimate_hrs"
            mdInput 
            [required]="!estimateMins.valid" 
            placeholder="Estimated Hours" 
            #estimateHrs="ngModel"
        >
        <div class="error-msg" *ngIf="!estimateHrs.valid && !estimateMins.valid">
            Please enter estimated hours 
        </div>
        <input 
            type="number" 
            min="0" 
            max="60" 
            id="estimate_min" 
            ngModel 
            name="estimate_min" 
            mdInput 
            [required]="!estimateHrs.valid" 
            placeholder="Estimated Minutes" 
            #estimateMins="ngModel"
        >
        <div class="error-msg" *ngIf="!estimateMins.valid && !estimateHrs.valid">
            Please enter estimated minutes
        </div>   
    </div>
    <button type='submit' [disabled]="!newtask.valid" >Submit</button>
</form>
Run Code Online (Sandbox Code Playgroud)

forms validation angular

14
推荐指数
3
解决办法
1万
查看次数

在react js中在父div上悬停时显示子div

你好 :) 我对 react js 比较陌生,我正在尝试在作为另一个 div 的子级的 div 上应用动画,父 div " portfolio-product-item" 显示从 wp rest api 提取的特色图像,子 div " portfolio-product-item-details" 具有以下内容帖子。

我想要做的是将鼠标悬停在父 div 中的特色图像上时显示内容,我的代码是这样的,我该如何实现?

    import React from 'react';
    import Home from './Home';
    require ('../../app.css');
    require ('../../animate.min.css');
    class Portfolio extends React.Component{
      render(){
       console.log(this.props.data.length);
       var contents=[];
       for (var i = 0; i < this.props.data.length; i++) {
       contents.push(
         <div className="col-xs-12 col-md-4">
            <div id="portfolio-product-item" >
              <img src={this.props.data[i].featured_image} />
              <div ref= "productDetails" id ="portfolio-product-item-details"  dangerouslySetInnerHTML={{__html: this.props.data[i].content.rendered}} />
              </div>
           </div>
        );
    }
    return( …
Run Code Online (Sandbox Code Playgroud)

javascript wordpress ecmascript-6 reactjs

2
推荐指数
2
解决办法
5200
查看次数