AngularJS: входной атрибут "required" полностью удаляет свою модель ng, когда элемент управления пуст - PullRequest
Новая
       0

AngularJS: входной атрибут "required" полностью удаляет свою модель ng, когда элемент управления пуст

1 голос
/ 04 марта 2020

Я заметил нечто странное в AngularJS 1.7.9.

Если я использую код <input type="text" ng-model="object.property"> и очищаю элемент управления ( т.е. , установите его значение в пустую строку), тогда object.property также устанавливается в пустую строку - что я и ожидаю.

Однако, если я добавлю атрибут required к <input>, и очистите элемент управления, затем property будет полностью удален из object!

Это предполагаемое поведение? Если да, то есть ли обходной путь?

ДЕМО 

angular.module("app",[])
.controller('requiredTestController', ['$scope', function ($scope) {
    
    $scope.user = {
        name: 'delete this text'
    };
    
    $scope.userWithRequiredName = {
        name: 'delete this text'
    };
    
}]);
<script src="//unpkg.com/angular/angular.js"></script>

<body ng-app="app" ng-controller="requiredTestController">

    <p>user: {{ user }}</p>
    <input type="text" ng-model="user.name">
    
    <hr>
    
    <p>userWithRequiredName: {{ userWithRequiredName }}</p>
    <input type="text" ng-model="userWithRequiredName.name" required>

</body>

Ответы [ 2 ]

1 голос
/ 04 марта 2020

По умолчанию недопустимые значения не сохраняются в модели (вместо этого сохраняется ноль), и пустая строка в вашем случае недопустима, чтобы изменить это добавление: 

ng-model-options="{allowInvalid: true}
0 голосов
/ 04 марта 2020

Использование ng-model-options="{allowInvalid: true}":

Для получения дополнительной информации см.

ДЕМО 

angular.module("app",[])
.controller('requiredTestController', ['$scope', function ($scope) {
    
    $scope.user = {
        name: 'delete this text'
    };
    
    $scope.userWithRequiredName = {
        name: 'delete this text'
    };
    
}]);
<script src="//unpkg.com/angular/angular.js"></script>

<body ng-app="app" ng-controller="requiredTestController">

    <p>user: {{ user }}</p>
    <input type="text" ng-model="user.name">
    
    <hr>
    
    <p>userWithRequiredName: {{ userWithRequiredName }}</p>
    <input type="text" ng-model="userWithRequiredName.name"
           ng-model-options="{allowInvalid: true}" required>

</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

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

...