You are not missing anything. You have made the discovery that any sensible person does that Angular is far superior to React.

This might be useful for you..

npmjs.com/package/react-validation

I can understand your pain, I am facing the same issues and I believe that create a wrapper around required components like input and select is only the best bet. I am also doing a blog series where I'm planning to cover all this in detail and how I solve this issue at my work. classandobjects.com/right_form_validation_in_react

Here is a nice solution for React with form and validations: npmjs.com/package/react-awesome-form-validator . Hope you like it!

I think client side validation is something which ideally should not be mixed with business logic in the code. This library (developed by me) has been made with idea of wrapping your fields to be validated and you should be done leaving all validation task to the library.

The idea is to be able to wrap any kind of component. It supports material-ui components as well. If your component is not supported out of box, the support can be added easily.

Angular is an MVW framework whereas React is just a view library. If you need a proper architecture and other features like form validations etc, you can combine it with a framework like Angular (although many developers prefer flux architecture).

It is not fair to say that one is superior to the other. Both are different and handle things in different ways. According to me the best way to validate a form in React is to do it yourself.

I don't exactly know how Angular 2 does validations so can't speak for that. However, I will highlight couple of approaches you can take to do form validation in React, choice between the two approaches depends on your requirements for input fields.

First- You can assign an event handler on every input which will perform checks specific to that particular input field. Say you want to restrict an input field to only 140 characters. Here's a way to do it.

var ExampleForm = React.createClass({
    // some stuff .....

    checkStatusLimit: function(e) {
        var status = e.target.value.trim();

        if(status.length >= 140){
            React.findDOMNode(this.refs.status).value = status.substr(0,140);
            e.preventDefault();
            //trigger error 
            //console.log('aah.. Status is not a story!')
        }

        // do stuff like updating state etc.
        // this.setState({status: status});
    },

    submitForm: function(e) {
        e.preventDefault();
        // Dispatch an action or make an Ajax call to server using the state.
    },

    render: function() {
        <form onSubmit={this.submitForm}>
            <input type='text' ref='status' onChange={this.checkStatusLimit} />
            <button type='submit' >Submit</button>
        </form>
    }
});

Second- In case you don't have the requirements of making customized checks you can use some library like validator which will save you from writing your regex or validations, you won't have to write a event handler for every input field but you still have to run validatons for all fields that you want to be validated before the form is submitted. Say you have two fields one where you have to check for proper email format and second for username which only allows numbers and strings.

var ExampleForm = React.createClass({
    // some stuff .....

    submitForm: function(e) {
        e.preventDefault();
        var email = React.findDOMNode(this.refs.email).value;
        var username = React.findDOMNode(this.refs.username).value;

        if(!validator.isEmail(email) || !validator.isAlphanumeric(username)){
            //return and trigger Error.
        }

        // Dispatch an action or make an Ajax call to server with email and username.
    },

    render: function() {
        <form onSubmit={this.submitForm}>
            <input type='email' ref='email' />
            <input type='text' ref='username' />
            <button type='submit' >Submit</button>
        </form>
    }
});

You can also use a combination of these two to handle validations. Hope this helps.

Angular is a full MVC(Model View Controller) framework while react is just the V(view). It shouldn't be surprising that react does not have form validation(which is the work of the controller). But there are ways to do it. These should help

• stackoverflow.com/questions/24019431/how-to-prope…
• youtube.com/watch