Common usage of ANGULARJS services
Last Update:2016-05-27
Source: Internet
Author: User
<span id="Label3"></p> <ul> <ul> <li>The service can persist data over the entire life cycle of the application and will not be clear when switching routes or reloading views (the controller is instantiated only when Needed)</li> <li>A service is a singleton object that will only be instantiated once in each application</li> </ul> </ul><p><p></p></p> <ol> <ol> <li>Service saves data for the lifetime of the app</li> </ol> </ol><pre>Angular.module (' myApp ')<span style="color: #000000;"><span style="color: #000000;">). Factory (</span></span>' MyService ', [<span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">(){ </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">var</span></span>store_id =<span style="color: #0000ff;"><span style="color: #0000ff;">NULL</span></span><span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">Set_curr_storeid (id) {store_id</span></span>=<span style="color: #000000;"><span style="color: #000000;">id; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">; } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">Get_curr_storeid () {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;">store_id}</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;"> { </span></span>' Set_curr_storeid '<span style="color: #000000;"><span style="color: #000000;">: set_curr_storeid,</span></span>' Get_curr_storeid '<span style="color: #000000;"><span style="color: #000000;">: Get_curr_storeid}}])</span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">when used in a controller Myservice.set_curr_storeid (id) to set its value</span></span></pre><p><p>2. Encapsulate some common function functions in the service and call each controller</p></p><pre>Angular.module (' myApp ')<span style="color: #000000;"><span style="color: #000000;">, []). Factory (</span></span>' Commonhelper ', [<span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;"> () { </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">function</span></span><span style="color: #000000;"><span style="color: #000000;">get_china_num (status) {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;">Switch</span></span><span style="color: #000000;"><span style="color: #000000;">Status {</span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> case</span>1<span style="color: #000000;"><span style="color: #000000;">: </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span>' Number One '<span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> break</span><span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> case</span>2<span style="color: #000000;"><span style="color: #000000;">: </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span>' Number two '<span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> break</span><span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">default</span></span><span style="color: #000000;"><span style="color: #000000;">: </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span>Other<span style="color: #000000;"><span style="color: #000000;">; </span></span><span style="color: #0000ff;"><span style="color: #0000ff;"></span> break</span><span style="color: #000000;"><span style="color: #000000;">; } } </span></span><span style="color: #0000ff;"><span style="color: #0000ff;">return</span></span><span style="color: #000000;"><span style="color: #000000;"> { </span></span>' Get_china_num '<span style="color: #000000;"><span style="color: #000000;">: get_china_num};}]);</span></span><span style="color: #008000;"><span style="color: #008000;">//</span></span><span style="color: #008000;"><span style="color: #008000;">use the service directly in the expression bound in the page, like the role</span> of a filter</span><div ng-repeat = "one_menu in menus" > <p>{{commonhelper.get_china_num (one_menu.status)}}</p></ Div></pre><p><p></p></p><p><p>Common usage of ANGULARJS services</p></p></span>
