Question

HTML

<form role="form" ng-submit="addStore(store)" name="AddStoreForm" novalidate>
    <label>Store Category</label>
        <label class="checkbox-inline"  ng-repeat="store_category in store_cat">
            <input type="checkbox" name="store_category" ng-model="store.store_category">{{store_category.name}}
        </label>
    </label>
 </form>
 <button type="submit" class="btn btn-primary campwidth">SUBMIT</button>

AngularJS

$scope.store_cat = [
    { name: 'A', selected: false },
    { name: 'B', selected: false },
    { name: 'C', selected: false }
];
$scope.addStore = function(store){
    console.log("responsestore", store);
    alert(store.store_category);
};

这里我把商店类别作为数组。提交表格后。我的alertbox类别未定义。我想使用API发送结果。如何解决这个问题。 PLUNKER

Answer 1

它可以使用按钮标签，而不是像bootstrap <button type="submit" class="btn btn-primary campwidth" ng-click="addStore(store_cat)">SUBMIT</button>中的表单一样，这里不需要使用表单标签b＆＃39;因为它可能会导致angular.js中的冲突，因此，它肯定会用于复选框。 http://plnkr.co/edit/qSFnxTNZ4n63pw3JXZA5?p=preview

Answer 2

你可以这样做：<button type="submit" class="btn btn-primary campwidth" ng-click="addStore(store_cat)">SUBMIT</button> here http://plnkr.co/edit/KtBzqeMF9FZt6bnI0MBF?p=preview 您不应该使用表单并使用该函数nope，当您使用angular时，这种方式是错误的。

Answer 3

假设您的问题是数据格式没有被推送到新的store对象，这里有一个解决方案：

<form role="form" name="AddStoreForm" novalidate ng-init="store={}">
  <label>Store Category</label>
  <label class="checkbox-inline" ng-repeat="store_category in store_cat">
    <input type="checkbox" name="store_category" ng-init="store[$index]={name: store_category.name, selected: false}" ng-model="store[$index].selected">{{store_category.name}}
  </label>
  </label>
  <button type="submit" ng-click="addStore(store)"  class="btn btn-primary campwidth">SUBMIT</button>
</form>

plunker带有工作示例。

复选框选择无法在angularjs中工作

3 个答案: