AngularJS(v1.4.0-rc.1) filter 從數組項中選擇一個子集

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

28

29

30

31

32

33

34

35

36

<code>&lt;!doctype html&gt;</code>

<code>&lt;</code><code>html</code> <code>ng-app</code><code>=</code><code>"dynamicTemplate"</code><code>&gt;</code>

<code>&lt;</code><code>head</code><code>&gt;</code>

<code>    </code><code>&lt;</code><code>script</code> <code>src</code><code>=</code><code>"jslib/angular.js"</code><code>&gt;&lt;/</code><code>script</code><code>&gt;</code>

<code>    </code><code>&lt;</code><code>script</code> <code>type</code><code>=</code><code>"text/javascript"</code><code>&gt;</code>

<code>    </code><code>angular.module('dynamicTemplate', []).controller('PhoneListCtrl',function($scope) {</code>

<code>        </code><code>$scope.phones = [</code>

<code>            </code><code>{</code>

<code>                </code><code>"name": "Nexus S",</code>

<code>                </code><code>"snippet": "Fast just got faster with Nexus S."</code>

<code>            </code><code>},</code>

<code>                </code><code>"name": "Motorola XOOM with Wi-Fi",</code>

<code>                </code><code>"snippet": "The Next, Next Generation tablet."</code>

<code>                </code><code>"name": "MOTOROLA XOOM",</code>

<code>            </code><code>}</code>

<code>        </code><code>];</code>

<code>    </code><code>});</code>

<code>    </code><code>&lt;/</code><code>script</code><code>&gt;</code>

<code>&lt;/</code><code>head</code><code>&gt;</code>

<code>&lt;</code><code>body</code><code>&gt;</code>

<code>    </code><code>Search: &lt;</code><code>input</code> <code>ng-model</code><code>=</code><code>"query"</code><code>&gt;</code>

<code>    </code><code>&lt;</code><code>div</code> <code>ng-controller</code><code>=</code><code>"PhoneListCtrl"</code><code>&gt;</code>

<code>        </code><code>&lt;</code><code>ul</code><code>&gt;</code>

<code>            </code><code>&lt;</code><code>li</code> <code>ng-repeat</code><code>=</code><code>"phone in phones|filter:query"</code><code>&gt;</code>

<code>                </code><code>`phone`.`name`</code>

<code>                </code><code>&lt;</code><code>p</code><code>&gt;`phone`.`snippet`&lt;/</code><code>p</code><code>&gt;</code>

<code>            </code><code>&lt;/</code><code>li</code><code>&gt;</code>

<code>        </code><code>&lt;/</code><code>ul</code><code>&gt;</code>

<code>    </code><code>&lt;/</code><code>div</code><code>&gt;</code>

<code>&lt;/</code><code>body</code><code>&gt;</code>

<code>&lt;/</code><code>html</code><code>&gt;</code>

 本文轉自 antlove 51CTO部落格，原文連結:http://blog.51cto.com/antlove/1651706