AngulaJS ng bind не работает - Невозможно установить свойство undefined - PullRequest
Новая
       1

AngulaJS ng bind не работает - Невозможно установить свойство undefined

0 голосов
/ 30 октября 2018

Я новичок в AngularJS. Я пытаюсь установить значение для span через AngularJS ng-bind при проверке имени. Я пытался во многих отношениях но, к сожалению, это не работает.

HTML: 

<div class="modal fade" id="myModal" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true" ng-controller="modalCtrl as data">

    <input id="name" ng-model="data.name"
       type="text" ng-blur="validateName(this.data)" />
    <span ng-bind="data.name.errMsg"></span>

</div>

JavaScript: 

$scope.validateName=function(obj){
    var name = obj.name;
    var regex = new RegExp("^[a-zA-Z0-9\/\@\&\%\*\$\>\<\\[\\]\,\(\)\_\'\;\ \:\\-\\.]+$");
    if(name != undefined && name != null && name.length < 3){
        obj.name.errMsg = "Please enter minimum 3 characters in Name";
        //$scope.name.errMsg = "Please enter minimum 3 characters in Name"
        // TypeError: Cannot set property 'errMsg' of undefined
    }
};

Ответы [ 4 ]

0 голосов
/ 30 октября 2018

Вам необходимо определить errMsg для правильной переменной области видимости.

Попробуй вот так 

angular.module("app",[])
.controller("modalCtrl",function(){
var ctrl = this;
ctrl.nameObj = {};
ctrl.nameObj.name= "sss";

ctrl.validateName=function(){
    var name = ctrl.nameObj.name;
    var regex = new RegExp("^[a-zA-Z0-9\/\@\&\%\*\$\>\<\\[\\]\,\(\)\_\'\;\ \:\\-\\.]+$");
    if(name != undefined && name != null && name.length < 3){
        ctrl.nameObj.errMsg = "Please enter minimum 3 characters in Name"
        // TypeError: Cannot set property 'errMsg' of undefined
    } else { ctrl.nameObj.errMsg = "";}
};

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="app" ng-controller="modalCtrl as data">

    <input id="name" ng-model="data.nameObj.name"
       type="text" ng-blur="data.validateName()" />
    <span ng-bind="data.nameObj.errMsg"></span>
    {{data.nameObj.errMsg}}

</div>
0 голосов
/ 30 октября 2018 
<div class="modal fade" id="myModal" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true" ng-controller="modalCtrl as data">

    <input id="name" ng-model="data.name"
       type="text" ng-blur="validateName(this.data)" />
    <span ng-bind="data.errMsg"></span> // data.errMsg instead of data.name.errMsg

</div>


$scope.validateName=function(obj){
    var name = obj.name;
    var regex = new RegExp("^[a-zA-Z0-9\/\@\&\%\*\$\>\<\\[\\]\,\(\)\_\'\;\ \:\\-\\.]+$");
    if(name != undefined && name != null && name.length < 3){
        obj.errMsg = "Please enter minimum 3 characters in Name"; 
        //obj.errMsg instead of obj.name.errMsg
    }
};
0 голосов
/ 30 октября 2018

Вы можете попробовать этот код ниже, также, пожалуйста, проверьте эту ссылку плунжера для рабочего примера вашего данного сценария.

Шаблон: 

<body ng-controller="MainCtrl as data">
    <div class="modal fade" id="myModal" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
        <input id="name" ng-model="data.name" type="text" ng-blur="validateName(this.data)" /><br/>
        <span ng-bind="data.errMsg"></span>
    </div>
</body>

Контроллер: 

$scope.validateName=function(obj){
    var name = obj.name;
    var regex = new RegExp("^[a-zA-Z0-9\/\@\&\%\*\$\>\<\\[\\]\,\(\)\_\'\;\ \:\\-\\.]+$");
    if(name != undefined && name != null && name.length < 3){
        obj.errMsg = "Please enter minimum 3 characters in Name";
    } else obj.errMsg = '';
};
0 голосов
/ 30 октября 2018

obj.name будет строкой, а не объектом. Вы не можете установить свойство строкового типа. Вы можете установить объект следующим образом. 

obj = [{name:'name', errMsg:'error message here'}]
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...