CODEWITHSUNDEEP
angularjsangular-ngmodelng-controller
user1292594
user1292594

Reputation: 29

ng-model not working inside ng-controller

I have created an angular directive of input

 mainApp.directive('myInput', function () {
    return {
        restrict: 'E',
        template: '<label class="form-group"> <span>{{name}}</span>{{required}}
    <input class="form-control"  placeholder="{{placeholder}}" type="{{type}}" ng-required= "{{mandatory}}" > </label>',
        replace: true,
        scope: {
            placeholder: '@',
            type: '@',
            name: '@',
            mandatory: '@',
            value:'@',
        },
    }
});

the controller

        mainApp.controller("myController", ["$scope", function ($scope) {
             $scope.Firstname = ' ';
}]);

the HTML

<my-Input type="text" placeholder="First name Last name" mandatory="0" ng-model="$ctrl.Firstname"></my-Input>
    <h4>{{$ctrl.Firstname}}</h4>

Unable to print the input text inside tag. Please help. Demo URL: http://codepen.io/JEETPAL/pen/pRWmKJ?editors=1010

Upvotes: 0

Views: 1582

Answers (1)

Salih Şenol &#199;akarcı
Salih Şenol &#199;akarcı

Reputation: 2330

just use ng-model="Firstname" instead of ng-model="$ctrl.Firstname" in your controller. If you didnt indicate controller as $ctrl

And also

You should add ng-model inside of your directive's template and send your ng-model value through binding ngmodel-value = "Firstname" and then in your directive's scope add ngmodelValue = "=" for two way binding

http://codepen.io/anon/pen/EZwzOm?editors=1010

Upvotes: 2

Related Questions