ng-model 在 ng-controller 中不起作用

Question

我创建了一个 angular 输入指令

 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:'@',
        },
    }
});

控制器

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

HTML

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

无法打印标签内的输入文本。请帮忙。演示 URL：http://codepen.io/JEETPAL/pen/pRWmKJ?editors=1010

Answer 1

只需在您的控制器中使用 ng-model="Firstname" 而不是 ng-model="$ctrl.Firstname"。如果您没有指明 controller as $ctrl

还有

您应该在您的指令模板中添加 ng-model 并通过绑定 ngmodel-value = "Firstname" 发送您的 ng-model 值，然后在您的指令范围内添加 ngmodelValue = "=" 进行双向绑定

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

ng-model 在 ng-controller 中不起作用

ng-model not working inside ng-controller

angularjs

angular-ngmodel

ng-controller