# `ngModel [NgModelController]` ( type in module `ng` )

## Description

`NgModelController` provides API for the `ng-model` directive. The controller contains services for data-binding, validation, CSS update, value formatting and parsing. It specifically does not contain any logic which deals with DOM rendering or listening to DOM events. The `NgModelController` is meant to be extended by other directives where, the directive provides DOM manipulation and the `NgModelController` provides the data-binding.

This example shows how to use `NgModelController` with a custom control to achieve data-binding. Notice how different directives ( `contenteditable` , `ng-model` , and `required` ) collaborate together to achieve the desired result.

#### Source

#### Demo

## Methods

- ### $render()

  Called when the view needs to be updated. It is expected that the user of the ng-model directive will implement this method.

- ### $setPristine()

  Sets the control to its pristine state.

  This method can be called to remove the 'ng-dirty' class and set the control to its pristine state (ng-pristine class).

- ### $setValidity(validationErrorKey, isValid)

  Change the validity state, and notifies the form when the control changes validity. (i.e. it does not notify form if given validator is already marked as invalid).

  This method should be called by validators - i.e. the parser or formatter functions.

  #### Parameters

  - `validationErrorKey – {string} –`

    Name of the validator. the `validationErrorKey` will assign to `$error[validationErrorKey]=isValid` so that it is available for data-binding. The `validationErrorKey` should be in camelCase and will get converted into dash-case for class name. Example: `myError` will result in `ng-valid-my-error` and `ng-invalid-my-error` class and can be bound to as `{{someForm.someControl.$error.myError}}` .

  - `isValid – {boolean} –`

    Whether the current state is valid (true) or invalid (false).

- ### $setViewValue(value)

  Read a value from view.

  This method should be called from within a DOM event handler. For example `input` or `select` directives call it.

  It internally calls all `formatters` and if resulted value is valid, updates the model and calls all registered change listeners.

  #### Parameters

  - `value – {string} –`

    Value from the view.

## Properties

- ### $viewValue

  Actual string value in the view.

- ### $modelValue

  The value in the model, that the control is bound to.

- ### $parsers

  Whenever the control reads value from the DOM, it executes all of these functions to sanitize / convert the value as well as validate.

- ### $formatters

  Whenever the model value changes, it executes all of these functions to convert the value as well as validate.

- ### $error

  An object hash with all errors as keys.

- ### $pristine

  True if user has not interacted with the control yet.

- ### $dirty

  True if user has already interacted with the control.

- ### $valid

  True if there is no error.

- ### $invalid

  True if at least one error on the control.