Himmators
Himmators

Reputation: 15006

Conditionally add attribute in angular

I want to use the $scope to set if an attribute should be used or not in angular. Here is my scope:

fields:
    [
        {
            label: 'First Name',
            name: 'firstname',
            key: 'entry.326845034',
            type: 'text',
            required: true
        }
    ]

it's the required attribute I want to set. I'm imagining something like {{if fields.required == true | required}}, but I can''t find any documentation on it.

Upvotes: 13

Views: 9498

Answers (2)

BALA
BALA

Reputation: 188

By using "ng-attr" you can add attributes dynamically to your HTML ,If you have angular 1.14 or later.

I have a table with two columns (ROLL NO & STUDENT NAME), I have to add a attribute(st-sort-default) to "STUDENT NAME" column to indicate users that table has been sorted by the same column.

I have used ng-attr property

ng-attr-(attribute name required)="condition"

If the condition is true it will add the attribute name you specified

e.g:-

(--Controller--)

$scope.headers= [{key:'id',title:'ROLL NO'},{key:'name',title:'STUDENT NAME'}]

(--html--)

<th ng-repeat="col in headers" ng-attr-st-sort-default="{{col.key ==='name'}}"> {{col.title}} 
</th>

Upvotes: 0

John Munsch
John Munsch

Reputation: 19528

Are you wanting to set required on a form element like this?

<input required>

If so you can use

<input ng-required="fields.required"> 

and the true/false state of the variable will end up applying or removing the required attribute on the input.

Upvotes: 34

Related Questions