为什么我的按钮没有使用 ng-disabled 禁用？答案

【问题标题】：Why isn't my button disabled using ng-disabled?为什么我的按钮没有使用 ng-disabled 禁用？
【发布时间】：2015-10-04 06:27:27
【问题描述】：

如果我的范围内的值为“真”，我会使用 Angular 并尝试禁用按钮。我看到ng-disabled 似乎很完美，但我不知道为什么它不起作用...

这是我的 HTML：

<div ng-controller="MyCtrl">
        <h4>{{ building.isBuildable }}</h4>
        <button ng-click='build(building.id)' 
                class="btn btn-primary" 
                ng-disabled="!build.isBuildable">
       Build
       </button>
</div>

还有我的角度：

var myApp = angular.module('myApp',[]);

myApp.factory('Colony', function () {
    'use strict';
    return {
        isBuildable: function () {
            return true;
            //return false;
        }
    };
});
myApp.controller('MyCtrl', ['$scope', 'Colony', function ($scope, Colony) {
    'use strict';
     var building = {
         name: 'Building Name',
         isBuildable: null
     };
     $scope.building = building;
     $scope.building.isBuildable = Colony.isBuildable();   
     $scope.build = function (id) {

     };
}]);

http://jsfiddle.net/xz7arL0s/1/

正如您在 jsfiddle 中看到的，即使 isBuildable 为真，它也始终处于禁用状态。我在这里错过了什么？

【问题讨论】：

标签： javascript angularjs angularjs-ng-disabled

【解决方案1】：

您有一个错字，您指的是 build 而不是 ng-disabled 绑定中的 building。

将您的代码更新为：

<div ng-controller="MyCtrl">
        <h4>{{ building.isBuildable }}</h4>
        <button ng-click='build(building.id)' 
                class="btn btn-primary" 
                ng-disabled="!building.isBuildable">
       Build
       </button>
</div>

我也在 Fiddle 上编辑了这个。

【讨论】：