CODEWITHSUNDEEP
angularjsangularjs-directive
user3551334
user3551334

Reputation: 53

Angular expression doesn't work with ng-disabled

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.js"></script>

<body ng-app="myApp">
<div ng-controller="toDoCtrl">
   <div>
    <hr>
    <form class="form" name="commentForm" ng-submit="vm.submitCommentForm()">

        <div class="form-group">
            <label for="fieldBody">Comment:</label>
                        <textarea name="body" id="fieldBody" class="form-control" rows="3"
                               ng-change="vm.changeCommentForm()"
                               ng-model="vm.commentForm.body"></textarea>
        </div>

        <div class="form-group">
            <button type="submit" class="btn btn-primary" ng-disabled="!vm.validCommentForm">Comment</button>
        </div>
    </form>
    <hr>
</div>
</div>

Script

    var app = angular.module('myApp', []);
    app.controller('toDoCtrl', function () {
    var vm = this;
    vm.validCommentForm = true;
    })

The "comment" button appears disabled when vm.validCommentForm = true
Meanwhile if I hardcode ng-disabled=0comment button appears working, as supposed. What did I get wrong?

Upvotes: 0

Views: 85

Answers (1)

charlietfl
charlietfl

Reputation: 171679

You are using controllerAs methodology but not setting the alias in view

Try changing

<div ng-controller="toDoCtrl">

To

<div ng-controller="toDoCtrl as vm">

Upvotes: 3

Related Questions