Возвращаемые данные из угловой директивы

Question

Я пишу свою первую директиву в угловом формате - это, по сути, всего лишь оболочка виджета для поиска в свободной базе, написанная в jquery.

Я хочу сделать приложение директивы независимым (с единственными зависимостями, являющимися внешними css и jquery).

Here is a plunkr Директивы, как и сейчас.

И сама директива:

directive('suggest', function() { 
    return { 
     restrict: 'E', 
     template: "<input type='text'>", 
     replace:true, 
     link: function(scope, element, attrs) { 
     var language = 'en'; //set english as default language 
     if (attrs.lang){ 
      language = attrs.lang; 
      attrs.$observe('lang', function(value) { 
      console.log("lang val " + value); 
      language = value; 
      }); 
     } 
     $(element).suggest({ 
      "lang": language 
     }) 
     .bind("fb-select", function(e, data) { 
      console.log(data); 
     }); 
     } 
    }; 
}); 

Когда пользователь выбирает элемент из выпадающего меню, следующая функция работает:

.bind("fb-select", function(e, data) { 
      console.log(data); 
     }); 

Что является лучшей практикой для подачи данных из выбор приложения, использующего его?

Answer 1

Самым угловым способом было бы достичь связывания это с помощью данных (2 способа) в изолированном объеме:

restrict: 'E', 
     template: "<input type='text'>", 
     replace:true, 
     scope:{ 
     myModel:'=' 
     }, 
     link: function(scope, element, attrs) { 
     ............ 

и внутри этой функции выбора:

.bind("fb-select", function(e, data) { 
      console.log(data); 
      scope.myModel=data; 
}); 

использование:

<suggest my-model="someModel" .... />

и в вашем контроллере $ scope:

$scope.someModel="";

Вам все еще нужно обрабатывать первоначальное связывание для этого заранее выбранной модели в вашей директиве, хотя, но да, чистейший способ 2 способа привязки данных через точечную область.

EDIT

Эти 2 статей отлично подходит для оказания помощи порта Jquery плагиных Угловой:

http://rogerz.github.io/blog/2013/09/27/jQuery-to-angularjs/

http://henriquat.re/directives/advanced-directives-combining-angular-with-existing-components-and-jquery/angularAndJquery.html