AngularJS: установка модели для = = {} снова не очищает тип ввода = 'url'

У меня есть настройка fiddler, когда я нажимаю кнопку reset, она должна очищать входные элементы управления, это, похоже, работает, но не когда вход type='url'

Вот скрипач

Есть ли проблема или что-то, что я не понимаю.

Когда я устанавливаю

$scope.myform = {};

Это, похоже, очищает другой тип ввода, но тип ввода = 'url' не очищается.

Кто-нибудь знает, почему?

Ответ 1

Проблема, которую вы видите, происходит, когда у вас нет допустимого значения внутри ввода [type = "url" ]. Недопустимое значение остается в представлении (поле ввода) и не попадает в переменную области видимости внутри ng-модели. Переменная будет обновляться только тогда, когда и если значение верное.

Вы можете проверить его, введя действительное значение. Кнопка reset будет работать. Если вы введете недопустимое значение, оно не будет.

Вы можете исправить это, установив $scope.myform = null вместо $scope.myform = {}. Это очистит поле, потому что переменная (выражение) области видимости будет undefined. Он будет автоматически создан Angular после ввода допустимого значения в любом из полей.

Ответ 2

Поскольку вам нужно поместить правильный URL-адрес во второй ящик, например http://www.abc.com, тогда будет работать кнопка reset.

Ответ 3

Чтобы правильно обновить представление/модель, я предлагаю вам явно reset свойства модели следующим образом:

$scope.reset = function() {
    $scope.myform = {
        foo: '',
        bar: ''
    };
    $scope.formName.$setPristine();
};

Установка "myform" в пустой объект удаляет его поля, но не устанавливает их в пустую строку. Вероятно, очистка angular может не удалить значение, на которое ссылается представление, таким образом, путаница между моделью приложения и состояниями представления.

Надеюсь, что это помогло.