Javascript 未序列化预选中的inputbox

我有一个简单的代码，列出了许多颜色，并检查用户是否预先选择了一些颜色（这是在代码上设置的，但实际上它来自数据库）。 当我提交表单时，预先选中的输入不会列在数组中，如果我取消选中一些，这将不会从数组中删除

const SampleApp=angular.module（'SampleApp'，[]）
SampleApp.controller（'sampleAppController'，函数（$scope）{
$scope.colors=[“红色”、“绿色”、“蓝色”、“黑色”、“黄色”、“粉色”、“白色”]
$scope.preChecked=[“绿色”、“粉色”]
$scope.user={colors:[]}
$scope.colorArr=[]
$scope.isUserColor=color=>{
返回$scope.preChecked.some（uColor=>color==uColor）
}
$scope.handleSubmit=（）=>{
常量filteredColors=$scope.colors.filter（（颜色，索引）=>{
返回$scope.user.colors.some（（uColor，uIndex）=>{
返回索引===uIndex
})
})
$scope.colorArr=filteredColors
}    
})

{{color}}


提交
{{colorArr}}

不应同时使用

ng型号

和

ng检查指令

从文档中：

NGCHECK 如果

ngChecked

中的表达式为truthy，则在元素上设置checked属性

请注意，此指令不应与

ngModel

一起使用，因为这可能导致意外行为

-

---

---

不要同时使用

ng型号

和

ng已选中

。使用

ng model

进行双向绑定，使用

ng checked

进行单向绑定

<ul>
   <li ng-repeat="color in colors">
        <input
            type="checkbox"
            name="{{color}}"
            id="{{color}}"
            ̶n̶g̶-̶c̶h̶e̶c̶k̶e̶d̶=̶"̶i̶s̶U̶s̶e̶r̶C̶o̶l̶o̶r̶(̶c̶o̶l̶o̶r̶)̶"̶
            ng-model="user.colors[$index]"
            ̶v̶a̶l̶u̶e̶=̶"̶{̶{̶c̶o̶l̶o̶r̶}̶}̶"̶
        >
        <label for="{{color}}">{{color}}</label>
    </li>
</ul>

---

不要同时使用

ng型号

和

ng已选中

。使用

ng model

进行双向绑定，选中

ng

进行单向绑定。这解决了我的问题，谢谢！

$scope.user = { colors: [] };
$scope.user.colors = $scope.colors.map(c => $scope.preChecked.some(_ => _ == c));