Невозможно получить объектную модель в Angular

0

Я пытаюсь получить доступ к объектной модели с моего контроллера, но я всегда получаю undefine.

Вот мой код:

<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
    }

});

Здесь мой контроллер для модального:

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.

Теги:

1 ответ

1

Насколько я могу судить, ваша модель "примечания" не определена, потому что ваша ng-модель напрямую пытается получить доступ к ее свойствам. Добавьте этот код в контроллер справа вверху:

$scope.note = {c_message: ""};
  • 0
    Если двусторонняя привязка должна быть принята по номинальной стоимости, это не требуется. Еще мне не хватает как работают угловые контроллеры.
  • 0
    Код в вопросе будет работать, если доступ к модели является прямым наследующим свойством контроллера. Если модель была $ scope.c_message. Это также будет работать только для добавления «$ scope.note = {}». ng-модель не будет создавать иерархию объектов. По крайней мере, это то, что я испытал.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню