если заявление в НГ-нажмите

есть ли способ поставить условие внутри ng-click? Здесь я хочу, чтобы форма не была отправлена, если есть какие-либо ошибки формы, но тогда я получил исключение parse.

 <input  ng-click="{{if(profileForm.$valid) updateMyProfile()}}" name="submit" id="submit" value="Save" class="submit" type="submit">

Я попытался использовать ng-disabled, но тогда мой плагин проверки не работает, потому что форма никогда не отправляется вообще, поэтому она не запускается.

8 63
javascript angularjs

8 ответов:

не помещайте выражение условия в шаблон.

сделайте это на контроллере.

шаблон:

<input ng-click="check(profileForm.$valid)" name="submit" 
       id="submit" value="Save" class="submit" type="submit">
: 
$scope.check = function(value) {
    if (value) {
       updateMyProfile();
    }
}
130

это может быть неуместно и бесполезно, но поскольку это javascript, вам не нужно использовать тернарный, как предлагалось выше в инструкции ng-click. Вы также должны иметь возможность использовать синтаксис lazy evaluation ("или die"). Так что для вашего примера выше:

<input  ng-click="{{if(profileForm.$valid) updateMyProfile()}}" name="submit" id="submit" value="Save" class="submit" type="submit">

станет:

<input  ng-click="profileForm.$valid && updateMyProfile()" name="submit" id="submit" value="Save" class="submit" type="submit">

в этом случае, если профиль недействителен, то ничего не происходит, в противном случае вызывается updateMyProfile (). Как и в ссылке @falinsky, приведенной выше.

52

вот хак, который я обнаружил, что может работать для вас, хотя это не очень красиво, и мне лично было бы неловко использовать такую строку кода:

ng-click="profileForm.$valid ? updateMyProfile() : alert('failed')"

теперь вы, должно быть, думаете:"но я не хочу, чтобы он предупреждал ("не удалось"), если мой profileForm не действительным. Ну, это уродливая часть. Для меня, независимо от того, что я помещаю в предложение else этого тернарного оператора, никогда не выполняется.

но если его удалили ошибка выбрасывается. Так что вы можете просто набить его бессмысленно тревога.
Я же говорил, что это ужасно... но я даже не получаю никаких ошибок, когда я делаю что-то вроде этого.
Правильный способ сделать это, как упоминал Чэнь-Цзы, но каждому свое.

29

если вы действительно должны сделать это таким образом, вот несколько способов сделать это:

отключение кнопки с помощью ng-disabled

безусловно, самое простое решение.

<input ng-disabled="!profileForm.$valid" ng-click="updateMyProfile()" ... >

скрывая кнопку (и показывая что-то еще) с помощью ng-if

может быть нормально, если вы показываете/скрываете какую-то сложную разметку.

<div ng-if="profileForm.$valid">
    <input ng-click="updateMyProfile()" ... >
</div>
<div ng-if="!profileForm.$valid">
    Sorry! We need all form fields properly filled out to continue.
</div>

(помните, нет ng-else ...)

сочетание

связь с пользователем, где находится кнопка (он больше не буду искать его), но объясните, почему его нельзя щелкнуть.

<input ng-disabled="!profileForm.$valid" ng-click="updateMyProfile()" ... >
<div ng-if="!profileForm.$valid">
    Sorry! We need all form fields properly filled out to continue.
</div>
11

мы можем добавить событие ng-click условно без использования отключенного класса.

HTML:

  <input ng-click="profileForm.$valid && updateMyProfile()" name="submit" id="submit" value="Save" class="submit" type="submit">
5

от http://php.quicoto.com/inline-ifelse-statement-ngclick-angularjs/, Вот как вы это делаете, если вам действительно нужно:

ng-click="variable = (condition=='X' ? 'Y' : 'X')"
4

вы можете поместить условные обозначения внутри тегов. Попробуйте:

ng-class="{true:'active',false:'disable'}[list_status=='show']"
0

писать как

<input type="submit" ng-click="profileForm.$valid==true?updateMyProfile():''" name="submit" value="Save" class="submit" id="submit">
0