Директива AngularJS ng-disabled с выражением не работает

Пользовательская история. Когда новый пользователь нажимает кнопку "Новый пользователь" и принимает переключатель "Условия", кнопка "Регистр" должна быть включена.

Мой код в angularJS не работает. Кнопка "Регистр" остается отключенной. Интересно, что пошло не так?

<!DOCTYPE html>
<html ng-app>
<head>
    <script src="lib/angular/angular.min.js"></script>
</head>
<body>

<div ng-controller="LoginCtrl">
    <div>
        <label>New User?</label>
        <input type="checkbox" ng-model="isNewUser"/>
    </div>

    <div ng-show="isNewUser">
        <label>Accept Terms and Conditions</label>
        <input type="radio" value="yes" name="tnc" ng-model="tnc"/><label>Yes</label>
        <input type="radio" value="no" name="tnc" ng-model="tnc" /><label>No</label>
    </div>

    <div>
        <input type="submit" value="Login" ng-disabled="isNewUser" >
        <input type="submit" value="Register" ng-show="isNewUser" ng-disabled="hasAcceptedTnC('{{tnc}}')">
    </div>
</div>
</body>

<script language="JavaScript">
var LoginCtrl = function ($scope) {
        $scope.isNewUser = false;
        $scope.tnc = "no";

        $scope.hasAcceptedTnC = function(value) {
            //alert(value);
            return "yes"==value;
        };
    }
</script>
</html>

Ответы

Ответ 1

Выражение ng-disabled оценивается в данной области. Следовательно, вам потребуется только следующее без дополнительной интерполяции с {{..}}:

    <input type="submit" 
           value="Register" 
           ng-show="isNewUser" 
           ng-disabled="!hasAcceptedTnC(tnc)">

Обратите внимание, что я добавил !, так как вы, вероятно, хотите, чтобы кнопка была отключена, если пользователь не принял TnC.

Рабочая демонстрация: http://plnkr.co/edit/95UiO4Rd2IMh8T1KjSQK?p=preview

Далее был добавлен комментарий, объясняющий, как использовать {{...}}, и когда использовать голое выражение с заданной директивой ng-*. К сожалению, синтаксический ключ не скрыт в директивах, которые могут выявить эту информацию. Глядя на документация окажется самым быстрым способом узнать эту информацию.

Ответ 2

if ($scope.Data.length > 0)
  $scope.isNewUser = true;
else $scope.isNewUser = false;


<md-button class="md-raised md-primary" 
            ng-click="Search()" 
            ng-disabled="!isNewUser" 
            aria-label="pause">Assign </md-button>

Ответ 3

Я попытался получить помощь от вышеупомянутого решения, но это не сработало. Поэтому я нашел другое решение. Добавив следующий код в CSS для этого элемента, решает мою проблему    указатель-события: нет;

Итак, в общем: -

 element[disabled]{
  pointer-events: none;
 }