渲染後調用js函數Angular指令

Question

我正試圖創建一個快速的Angular指令，它將使用我找到的jQuery UI擴展來生成組合框。

擴展很簡單。我只需要創建一個標準的select元素，然後在其上運行「combobox（）」函數。不過我不確定在我的角度指令中如何做到這一點。

諧音在我看來/元/ combobox.html

<select class="dropdown" ng-options="option as option for option in selectOptions" ng-model="selectModel" /> 

APP-directives.js

appDirectives.directive('combobox', function() { 
    return { 
     restrict: 'E', 
     templateUrl: 'partials/elements/combobox.html', 
     scope: { 
      selectModel: "=model", 
      selectOptions: "=options" 
     } 
    }; 
}); 

<combobox model="query.favouriteFruit" options="fruits"></combobox> 

我不知道，我應該把在我打電話給.combobox（）。我試過這樣做：

$(function() { $("combobox select").combobox(); }); 

但當然這不起作用，因爲指令沒有及時呈現。有沒有辦法只在指令完成渲染時調用它？

感謝您的時間， 安迪

Answer 1

您可以處理邏輯指令的鏈接功能。

appDirectives.directive('combobox', function($timeout) { 
    return { 
     restrict: 'E', 
     templateUrl: 'partials/elements/combobox.html', 
     scope: { 
      selectModel: "=model", 
      selectOptions: "=options" 
     }, 
     link: function (scope, element, attrs) { 
      // wait till the initial digest cycle is triggered. 
      $timeout(function() { 
       // change the select to combobox 
       element.combobox(); 
      }); 
     } 
    }; 
});