- The ng-value directive in AngularJS used to binds the given expression of an input element or a select element.
- It is supported by <input> and <select> elements.
- It is useful for input option values are dynamically created using ng-repeat directive.
- ng-value directive achieves one-way binding of a given expression to an input element such as input[text] or textarea. These elements do not use ngmodel.
Syntax for ng-transclude Directive in AngularJS:
|expression||An angular expression that will set the element’s value attribute.|
Sample coding for ng-value directive in AngularJS:
Code Explanation for ng-value directive in AngularJS:
- The ng-app specifies the root element ("myApp") to define AngularJS application.
- The ng-controller controls the data of “myCtrl” in AngularJS application.
- The ng-repeat directive is used for repeats a set of names (X in names) in a given number of times and the output will be updated in the <li> tag.
- The “radio” is declare the type value of the <input> tag.
- ng-model binds the value from the HTML control to application data.
- ng-transclude directive is used to include the existing content “AngularJS” .
- The ng-value directive is used for sets the value attribute of an input element “X”.
- The ng-value directive shows the “you choose CSS Tutorial” when the valid text is given in the input.
- $scope.name is used to declare the scope object as HTML, CSS, PHP in array format.
- The value is given as my in the scope object and the output will be displayed in the <div> tag.
Sample Output for ng-value directive in AngularJS:
- When the page is loading the output displays the default value of CSS in the input field.
- If the user click the PHP button in the input field and output displays the value as “you choose PHP tutorial”.