Ng-view on load event

Question

Я новичок в Angular js. Я пытаюсь создать SPA. Ниже мой index.html

<div ng-view> 

      </div> 

и у меня есть частичный вид и его контроллер

myApp.controller('MainController', function ($scope, $http) { 

} 

И мой частичный вид

<accordion-group heading="EMPLOYER"> 

         <select class="employer" multiple data-size="5" data-max-options="3" data-live-search="true" ng-model="employer" ng-options="emp for emp in Employers" > 
         </select> 
         <button ng-click="addField('employer',employer)">Add Field</button> 

        </accordion-group> 
       </accordion> 

Здесь возникает проблема. Я хочу применить CSS к «работодатель» класс. Например, у меня есть много классов, и я использую Bootstrap select.

$('.employer').selectpicker({ 
        style: 'btn-info', 
        dropupAuto: false 
       }); 

Я хочу использовать приведенный выше код в частичном случае вид нагрузки. Как я могу это сделать ?

Может ли кто-нибудь помочь мне плз?

Спасибо,

Answer 1

Вы должны обернуть это Jquery вызов в угловой директивы. https://docs.angularjs.org/guide/directive

mainApp.directive('mySelectPicker', function() { 
    'use strict'; 

    return { 
     restrict: 'A', 
     link : function (scope, element, attrs) { 

      $(element).selectpicker({ 
       style: 'btn-info', 
       dropupAuto: false 
      }); 
     } 
    }; 
}); 

Затем обновите HTML как это:

<select my-select-picker class="employer" multiple data-size="5" data-max-options="3" data-live-search="true" ng-model="employer" ng-options="emp for emp in Employers" ></select>