开始写搜索功能，将javascript初始化的都转为了指令

public/index.html

@@ -35,6 +35,7 @@
         <script src="/scripts/directives/edit-directive.js"></script>
         <script src="/scripts/directives/menus-directive.js"></script>
         <script src="/scripts/directives/element-render-finish-directive.js"></script>
+        <script src="/scripts/directives/js-init-directive.js"></script>
         <script src="/scripts/controllers/bookmarks-controller.js"></script>
         <script src="/scripts/controllers/home-controller.js"></script>
         <script src="/scripts/controllers/login-controller.js"></script>

public/scripts/controllers/bookmarks-controller.js

@@ -58,6 +58,7 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
     });
 
     pubSubService.subscribe('EditCtr.inserBookmarsSuccess', $scope, function(event, params) {
+        params.showStyle = $scope.showStyle;
         console.log('subscribe EditCtr.inserBookmarsSuccess', params);
         getBookmarks(params);
     });
@@ -74,7 +75,7 @@ app.controller('bookmarksCtr', ['$scope', '$state', '$stateParams', '$filter', '
             .catch((err) => console.log('getBookmarks err', err));
     }
 
-    $scope.$on('elementRenderFinished', function(elementRenderFinishedEvent) {
+    $scope.$on('viewContentLoaded', function(elementRenderFinishedEvent) {
         $('.ui.dropdown').dropdown();
         $('.ui.calendar.js-date-begin').calendar({
             type: 'date',

public/scripts/controllers/edit-controller.js

@@ -153,8 +153,8 @@ app.controller('editCtr', ['$scope', '$state', '$timeout', 'bookmarkService', 'p
     }
 
     // 元素构造完成之后，开始使用jquery初始化
-    $scope.$on('elementRenderFinished', function(elementRenderFinishedEvent) {
+    $scope.$on('viewContentLoaded', function(elementRenderFinishedEvent) {
-        console.log('edit ui dropdown elementRenderFinished')
+        console.log('edit ui dropdown viewContentLoaded')
         $('.ui.modal.js-add-bookmark .ui.dropdown').removeClass('loading');
         $('.ui.dropdown').dropdown({
             forceSelection: false,

public/scripts/controllers/menus-controller.js

@@ -74,8 +74,9 @@ app.controller('menuCtr', ['$scope', '$stateParams', '$state', 'pubSubService',
     }
 
     // 元素构造完成之后，开始使用jquery初始化
-    $scope.$on('elementRenderFinished', function(elementRenderFinishedEvent) {
+
-        console.log('menus elementRenderFinished')
+    $scope.$on('viewContentLoaded', function(elementRenderFinishedEvent) {
+        console.log('menus viewContentLoaded')
         $('.js-bookmark-dropdown').dropdown({
             action: 'hide',
         });

public/scripts/controllers/search-controller.js

@@ -47,7 +47,7 @@ app.controller('searchCtr', ['$scope', '$state', '$stateParams', '$filter', '$wi
             .catch((err) => console.log('getBookmarks err', err));
     }
 
-    $scope.$on('elementRenderFinished', function(elementRenderFinishedEvent) {
+    $scope.$on('viewContentLoaded', function(elementRenderFinishedEvent) {
         $('.ui.dropdown').dropdown();
         $('.ui.calendar.js-date-begin').calendar({
             type: 'date',

public/scripts/directives/js-init-directive.js

@@ -0,0 +1,51 @@
+app.directive('jsDataBeginInit', function($compile) {
+    return {
+        restrict: 'A',
+        link: function($scope, $element, $attrs) {
+            $('.ui.calendar.js-date-begin').calendar({
+                type: 'date',
+                formatter: {
+                    date: function(date, settings) {
+                        if (!date) return '';
+                        var day = date.getDate();
+                        var month = date.getMonth() + 1;
+                        var year = date.getFullYear();
+                        return year + '/' + month + '/' + day;
+                    }
+                },
+                endCalendar: $('.ui.calendar.js-date-end')
+            });
+        },
+    };
+});
+
+
+app.directive('jsDataEndInit', function($compile) {
+    return {
+        restrict: 'A',
+        link: function($scope, $element, $attrs) {
+            $('.ui.calendar.js-date-end').calendar({
+                type: 'date',
+                formatter: {
+                    date: function(date, settings) {
+                        if (!date) return '';
+                        var day = date.getDate();
+                        var month = date.getMonth() + 1;
+                        var year = date.getFullYear();
+                        return year + '/' + month + '/' + day;
+                    }
+                },
+                startCalendar: $('.ui.calendar.js-date-begin')
+            });
+        },
+    };
+});
+
+app.directive('jsDropdownInit', function($compile) {
+    return {
+        restrict: 'A',
+        link: function($scope, $element, $attrs) {
+            $('.ui.dropdown').dropdown();
+        },
+    };
+});

public/views/edit.html

@@ -19,7 +19,7 @@
                     <div class="eight wide field" ng-class="{error:tagsError }">
                         <select class="ui fluid search dropdown js-tags" multiple="">
                             <option value="">选择已有分类，可以搜索已有标签，最多选择三个</option>
-                            <option value="{{ tag.id }}" ng-repeat="tag in tags" on-finish-render-filters>{{ tag.name }}</option>
+                            <option value="{{ tag.id }}" ng-repeat="tag in tags">{{ tag.name }}</option>
                         </select>
                     </div>
                     <div class="eight wide field">

public/views/menus.html

@@ -1,6 +1,6 @@
 <div class="js-menu" ng-controller="menuCtr">
     <div class="ui large menu js-login-in" ng-if="login">
-        <a class="item" ng-class="{selected:$index===selectLoginIndex}" ui-sref="{{ menu.uiSref }}" ui-sref-opts="{reload: true}" ng-repeat="menu in loginMenus" on-finish-render-filters>
+        <a class="item" ng-class="{selected:$index===selectLoginIndex}" ui-sref="{{ menu.uiSref }}" ui-sref-opts="{reload: true}" ng-repeat="menu in loginMenus">
             <div>{{ menu.title }}</div>
             <div class="ui floating simple dropdown icon js-bookmark-dropdown" ng-if="$index==0" ng-click="$event.stopPropagation();">
                 <i class="dropdown icon"></i>
@@ -45,6 +45,6 @@
         </div>
     </div>
     <div class="ui large menu js-not-login-in" ng-if="!login">
-        <a class="item" ng-class="{selected:$index==selectNotLoginIndex}" ui-sref="{{ menu.uiSref}}" ui-sref-opts="{reload: true}" ng-click="selectMenu($index, login)" ng-repeat="menu in notLoginMenus" on-finish-render-filters>{{ menu.title}}</a>
+        <a class="item" ng-class="{selected:$index==selectNotLoginIndex}" ui-sref="{{ menu.uiSref}}" ui-sref-opts="{reload: true}" ng-click="selectMenu($index, login)" ng-repeat="menu in notLoginMenus">{{ menu.title}}</a>
     </div>
 </div>

public/views/search.html

@@ -1,5 +1,80 @@
-<div class="ui small menu js-search-detail" ng-show="showSearch" ng-repeat="justSureRendered in [1]" on-finish-render-filters>
+<div class="ui grid">
-    <div class="ui dropdown item">
+    <div class="two wide column">
+        <div class="ui dropdown" js-dropdown-init>
+            <div class="text">自己书签</div>
+            <i class="dropdown icon"></i>
+            <div class="menu">
+                <div class="item">自己书签</div>
+                <div class="item">全站书签</div>
+            </div>
+        </div>
+    </div>
+    <div class="two wide column">
+        <div class="ui dropdown item" js-dropdown-init>
+            <div class="text">创建时间不限</div>
+            <i class="dropdown icon"></i>
+            <div class="menu">
+                <div class="item">时间不限</div>
+                <div class="item">一天内</div>
+                <div class="item">一周内</div>
+                <div class="item">一月内</div>
+                <div class="item">一年内</div>
+                <div class="divider"></div>
+                <div class="header">自定义</div>
+                <div class="ui calendar js-date-begin" js-data-begin-init>
+                    <div class="ui transparent input left icon">
+                        <i class="calendar icon"></i>
+                        <input type="text" placeholder="开始日期" ng-model="dateBegin">
+                    </div>
+                </div>
+                <div class="ui calendar js-date-end" js-data-end-init>
+                    <div class="ui transparent input left icon">
+                        <i class="calendar icon"></i>
+                        <input type="text" placeholder="结束日期" ng-model="dateEnd">
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="two wide column">
+        <div class="ui dropdown item" js-dropdown-init>
+            <div class="text">点击次数不限</div>
+            <i class="dropdown icon"></i>
+            <div class="menu">
+                <div class="item">自己书签</div>
+                <div class="item">全站书签</div>
+            </div>
+        </div>
+    </div>
+    <div class="three wide column">
+        <div class="ui dropdown item" js-dropdown-init>
+            <div class="text">点击时间不限</div>
+            <i class="dropdown icon"></i>
+            <div class="menu">
+                <div class="item">自己书签</div>
+                <div class="item">全站书签</div>
+            </div>
+        </div>
+    </div>
+    <div class="three wide column">
+        <div class="ui transparent icon input">
+            <input class="prompt" type="text" placeholder="用户账号" ng-model="username">
+        </div>
+    </div>
+    <div class="two wide column">
+        <div class="ui transparent input">
+            <input type="text" placeholder="标题，链接，分类" ng-model="searchWord">
+        </div>
+    </div>
+    <div class="one wide column">
+        <i class="search icon" title="搜索" ng-click="search()"></i>
+    </div>
+    <div class="one wide column">
+        <i class="space shuttle icon" title="隐藏搜索工具"></i>
+    </div>
+</div>
+<div class="ui small menu js-search-detail" ng-show="false">
+    <div class="ui dropdown item" js-dropdown-init>
         <div class="text">搜索范围</div>
         <i class="dropdown icon"></i>
         <div class="menu">
@@ -8,7 +83,7 @@
         </div>
     </div>
     <div class="item" style="width:136px;">
-        <div class="ui calendar js-date-begin">
+        <div class="ui calendar js-date-begin" js-data-begin-init>
             <div class="ui transparent input left icon">
                 <i class="calendar icon"></i>
                 <input type="text" placeholder="开始日期" ng-model="dateBegin">
@@ -16,14 +91,14 @@
         </div>
     </div>
     <div class="item" style="width:136px;">
-        <div class="ui calendar js-date-end">
+        <div class="ui calendar js-date-end" js-data-end-init>
             <div class="ui transparent input left icon">
                 <i class="calendar icon"></i>
                 <input type="text" placeholder="结束日期" ng-model="dateEnd">
             </div>
         </div>
     </div>
-    <div class="ui dropdown item">
+    <div class="ui dropdown item" js-dropdown-init>
         <div class="text">点击次数</div>
         <i class="dropdown icon"></i>
         <div class="menu">