關於模板引擎不在此做過多介紹，只將專案程式碼分享一下：
前端html程式碼
前端html中需要引用template.js 檔案，這個自己可以去百度尋找。這個引入要放在jQuery後面，因為它裡面會使用到jQuery。

      <div class="form-group">
                            <label for="area-id">所在城區</label>
                            <select class="form-control" id="area-id" name
 
="area_id">
                              <!--<option value="1">東城區</option>-->
                              <!--<option value="2">西城區</option>-->
                              <!--<option value="3">朝陽區</option>-->
                              <!--<option value="4">海淀區</option>-->
 

                              <!--<option value="5">昌平區</option>-->
                              <!--<option value="6">豐臺區</option>-->
                              <!--<option value="7">房山區</option>-->
                              <!--<option value="8">通州區</option>-->
 

                              <!--<option value="9">順義區</option>-->
                              <!--<option value="10">大興區</option>-->
                              <!--<option value="11">懷柔區</option>-->
                              <!--<option value="12">平谷區</option>-->
                              <!--<option value="13">密雲區</option>-->
                              <!--<option value="14">延慶區</option>-->
                              <!--<option value="15">石景山區</option>-->
                              <!--<option value="16">門頭溝區</option>-->
                            </select>
                            <!--使用模板引擎-->
                            <script type="text/html" id="area-tmpl">{{each areas as area}}
                                <option value="{{area.aid}}">{{area.aname}}</option>
                                {{/each}}</script>
                        </div>

之前是自己寫入的城區資訊，但是這種寫法不夠動態，於是我們去資料庫動態的獲取城區資訊

js程式碼

$(document).ready(function(){
    // $('.popup_con').fadeIn('fast');
    // $('.popup_con').fadeOut('fast');
    //向後端獲取城區的資訊
    $.get("/api/v1_0/areas",function (resp) {
        if(resp.errno==0){
        //    獲取到了城區資訊
        //     var areas=resp.data.areas;
        //     for(i=0;i<areas.length;i++){
        //         var area=areas[i];
        //         $("#area-id").append('<option value="'+area.aid+'">'+area.aname+'</option>');
        //     }
        //    使用模板引擎傳遞引數
            area_html=template("area-tmpl",{areas:resp.data.areas});
            $("#area-id").html(area_html);
        }
    })
});

上面遮蔽的那種方法，是常規的寫法，而使用模板引擎更為簡便。

後端的邏輯就不上傳了，主要就是去資料庫中查詢資料，然後將資料以json格式返回給前端即可。