Функция управления вызовом из директивы

Question

Я новичок в AngularJS. Я хочу создать приложение, которое может отображать информацию о книге, и пользователь может щелкнуть значок, чтобы удалить информацию о книге. Я использую клиентскую директиву, которая отображает каждую информацию о книге. В списке информации о книге есть значок, и пользователь может щелкнуть значок, чтобы удалить информацию о книге.

У меня есть прослушиватель ng-click на иконке в директиве, но я не знаю, как позволить ему вызвать функцию define в контроллере.

Не могли бы вы рассказать мне, как это сделать? Есть ли лучший способ его реализовать?

Благодаря

HTML код:

<div class="container" ng-app="myApp" ng-controller="bookCtrl"> 
<div ng-repeat="book in books | filter :{'name' : bookName}" book-List="book"></div> 
</div> 

app.js:

var app = angular.module('myApp',[]); 
app.controller('bookCtrl', function ($scope,$http){ 
    $scope.books=[]; 
    $http.get("products.json") 
    .then(function(response){ 
     $scope.books = response.data; 
    }); 

    $scope.removeItem = function(x){ 
     $scope.index = x; 
     $scope.books.splice(x,1); 
    } 
}); 

app.directive('bookList', function(){ 
    return{ 
     restrict: 'EA', 
     scope: { item : '=bookList'}, 
     templateUrl: "template.html", 
    }; 
}); 

Шаблон:

<div class="jumbotron" ng-app="myApp" ng-controller="bookCtrl"> 
     <div class="row" > 
      <div class="col-md-7"> 
       <h3>{{item.name}}</h3> 
      </div> 
      <div class="col-md-2"> 
       <button type="button" class="btn btn-primary">{{item.price}}</button> 
      </div> 
      <div class="col-md-2"> 
       <span class="glyphicon glyphicon-remove-sign" ng-click="removeItem($Index)"></span> 
      </div> 
     </div> 
     <div>{{item.description}}</div> 
    </div> 

Answer 1

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

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

Лучшим подходом было бы использовать ng-модель и содержать логику, которая изменяет данные в самой директиве. Я не могу представить примеры кода, поскольку я на мобильном устройстве, хотя вы можете посмотреть на примеры.

Кроме того, вы можете захотеть перевести свой http-вызов на услугу ради разделения проблем.