angularjs - Angular 指令不更新

Question

我在刷新/更新 Angular 指令时遇到问题。基本上有一个 Flag 按钮，它将对服务器进行异步调用，如果它成功，更改属性 userFlags 应该禁用该按钮并将其文本更改为“Flagged ...”。

这是指令:

app.directive('flagable', function() {
return {
    restrict: 'E',
    scope: { item: '=' },
    templateUrl: '/Content/templates/flagable.tmpl',
    controller: function($scope) {
        $scope.flag = function () {

            $scope.$apply(function () {
                // ITS NOT GOING IN HERE!
                //AJAX CALL HERE
                model.$modelValue.userFlags = [];
                Messenger().post("Your request has succeded! ");
            });
        };
    }
};
});

这是模板:

<div class="btn-group pull-right">
<button class="btn btn-small btn-danger" ng-disabled="{{item.userFlags != null}}"><i class="icon-flag"></i>
  <any ng-switch="item.userFlags==null">
    <any ng-switch-when="true">Flag</any>
    <any ng-switch-when="false">Flagged...</any>
  </any>
</button>
<button class="btn btn-small btn-danger dropdown-toggle" data-toggle="dropdown" ng-disabled="{{item.userFlags != null}}"><span class="caret"></span></button>
<ul class="dropdown-menu">
    <li><a href="#" ng-click="flag()">Inappropriate</a></li>
    <li><a href="#" ng-click="flag()">Overpost</a></li>
    <li><a href="#" ng-click="flag()">Spam</a></li>
</ul>
  </div>

有趣的是，将 Controller 逻辑更改为:

 $scope.flag = function () {
 $scope.item.userFlags = [];
 Messenger().post("Your request has succeded! " + $scope.item.viewCount);
 }; 

按钮正确刷新为“已标记...”的原因，但是，ng-disabled 并没有使按钮被禁用!在 Firebug 中，它显示 ng-disabled 属性已设置:ng-disabled="true"

Answer 1

您需要将范围项分配为“&”

var app = angular.module('app', []);
app.directive('flagable', function() {
return {
    restrict: 'E',
    scope: { item: '&' },
    templateUrl: 'flagable.tmpl',
    controller: function($scope) {
           $scope.flag = function()
           {
             $scope.item.userFlags = [];
           };
        }
    };
});

app.controller('appController', function($scope){
          $scope.item ={};
          //$scope.item.userFlags = null;
});

并且 ng-disable 应该有这样的值，因为 Controller 中已经存在 item 对象

ng-disabled="item.userFlags != null

这里有工作演示 http://plnkr.co/edit/zvO24fb082hiyeinWmQi?p=preview