将角度材质设计复选框绑定到控制器中的阵列

Question

我有一组材料设计复选框，我想将它们的值绑定到控制器中的数组。

为了实现这一点，我使用了this SO answer中描述的第一种方法。虽然值正在被添加并从列表中删除，但当我点击它们时，这些框不再显示为“已检查”。我的代码在下面，我也在this codepen中重新创建了这个问题。

HTML我复选框

<md-checkbox 
    ng-repeat="site in websites" 
    value="{{site}}" 
    ng-checked="selection.indexOf(site) > -1" 
    ng-click="toggleSelection(site)"> 
    {{site}} 
</md-checkbox> 

的JavaScript控制器

$scope.websites = ['Facebook', 'Twitter', 'Amazon']; 
    $scope.selection = ['Facebook']; 
    $scope.toggleSelection = function toggleSelection(site) { 
    var idx = $scope.selection.indexOf(site); 

    // is currently selected 
    if (idx > -1) { 
     $scope.selection.splice(idx, 1); 
    } 

    // is newly selected 
    else { 
     $scope.selection.push(site); 
    } 
    }; 
}); 

Answer 1

尝试改变这一点：

ng-checked="selection.indexOf(site) > -1" 

这样：

ng-checked="{{selection.indexOf(site) > -1}}" 

为我工作：http://codepen.io/anon/pen/xbNOmE