OnsenUI搜索示例

时间:2014-04-11 11:49:13

标签: angularjs cordova onsen-ui

我找到了OnsenUI用于开发Cordova并且我正在测试他们的组件

http://onsenui.io/guide/components.html

我停在ons-search-input

<ons-navigator title="Search Input">
   <ons-search-input 
       ng-model="searchText" 
       placeholder="Search">
   </ons-search-input>
</ons-navigator>

但我不知道它是如何工作的,例如,在列表中(ons-list),有没有例子?

由于

1 个答案:

答案 0 :(得分:1)

只需将其放入ons-list

即可
<ons-navigator title="Search Input">
  <ons-list>
    <ons-list-item style="padding-top: 5px">
     <ons-search-input
        ng-model="searchText" 
        placeholder="Search">
     </ons-search-input>   
    </ons-list-item>

    <ons-list-item>
      Item 1
    </ons-list-item>
    <ons-list-item>
      Item 2
    </ons-list-item>
    <ons-list-item>
      Item 3
    </ons-list-item>
  </ons-list>

</ons-navigator>

这是plunkr

http://plnkr.co/edit/OkASen?p=preview