リストのチェックボックスを追加する方法

Question

リストの各連絡先にチェックボックスを追加しようとしています。これは私の今のところですが、何らかの理由で連絡先の名前の隣にチェックボックスが表示されていません！

<div ng-controller="ContactsController" > 
     <ons-list class="person-list" > 
     <ons-list-header class="person-list-header" ng-init="people = contacts">{{char}}</ons-list-header> 
      <ons-list-item class="person" modifier="tappable" ng-repeat="person in contacts | filter:searchInput"> 
      <ons-row> 

       <ons-col class="checkbox checkbox--list-item"> 
       <input type="checkbox"> 
       <div class="checkbox__checkmark checkbox--list-item__checkmark"></div> 
       </ons-col> 
       <ons-col class="person-name" ng-click="contactsBack(person.username)" > 
       {{person.username}} 
       </ons-col> 
      </ons-row> 
      </ons-list-item> 
     </ons-list> 

Answer 1

レックスは、前述のように - あなたは、現在の問題に関連していないいくつかのコードを持っている - あなたは無関係なコードを入れていない場合には、通常は良いでしょうが、私はそれが、この場合の問題ではないと思います。

基本的にカスタムタグを使用しているので、必要なのは<ons-input type="checkbox"></ons-input>です。

ここにはsimple demoがあります。あなたは珍しい何かをやっている場合を除き、実際にもons-rowとons-col sは本当に必要されていない

- あなただけのその子にleftとcenterクラスを追加する場合ons-list-itemは、この機能を提供します。

<ons-list-item class="person" modifier="tappable" ng-repeat="person in contacts"> 
    <ons-input type="checkbox" class="left" input-id="input-{{$index}}"></ons-input> 
    <label class="center" for="input-{{$index}}">{{person.username}}</label> 
</ons-list-item>