javascript - 无法在 Angular 中获取对象模型

Question

我试图从我的 Controller 访问对象模型，但我总是无法定义。

这是我的代码:

<script type="text/ng-template" id="myModalContent">

    <div ng-form="noteForm" ng-controller="NoteCtrl">

        <div class="modal-header">
            <h3 class="modal-title">Add New Note</h3>
        </div>
        <div class="modal-body">

            <!-- other text input here -->

            <div class="row">
                <div class="form-group col-md-12" ng-class="{'has-error': noteForm.c_message.$invalid && noteForm.c_message.$touched, 'has-success': !noteForm.c_message.$invalid }">
                    <label class="control-label">Message</label>
                    <textarea class="form-control" name="c_message" ng-model="note.c_message" ng-minlength="10" required></textarea>
                    <span style="color: red" ng-show="noteForm.c_message.$dirty && noteForm.c_message.$invalid">
                        <span ng-show="noteForm.c_message.$error.required">Message is required!</span>
                        <span ng-show="noteForm.c_message.$error.minlength">Message is should be less than 10 character!</span>
                    </span>
                    <p class="text-left">Number of characters left: <span ng-bind="word_count()">100</span></p> <!-- counter -->
                </div>
            </div>

        </div>
        <div class="modal-footer">
            <button class="btn btn-primary btn-sm" ng-disabled="noteForm.$invalid" ng-click="sendForm()">OK</button>
            <button class="btn btn-warning btn-sm" ng-click="cancel()">Cancel</button>
        </div>

    </div>

</script>

这是我的 JS:

sampleApp.controller('NoteCtrl', function($scope) {


    $scope.sendForm = function () {
        console.log($scope.note); //ajax process
    }

    $scope.word_count = function() {
        return 100 - $scope.note.c_message.length; //return undefined
    }

});

这是我的模式 Controller :

sampleApp.controller('MainCtrl', function($scope, $modal, $log) {

    $scope.animationsEnabled = true;

    $scope.open = function open(size) {

        var modalInstance = $modal.open({
            animation: $scope.animationsEnabled,
            templateUrl: 'myModalContent',
            size: size,
            controller: 'ModalInstanceCtrl',
        });

    }

});

如果我输入长度不超过 10 个字符的任何字符，计数器不会递减，也会出现错误。如果我输入超过10，它就会递减。

Answer 1

据我所知，您的“note”模型未定义，因为您的 ng-model 直接尝试访问它的属性。将此代码添加到 Controller 顶部:

$scope.note = {c_message: ""};