Директива Angularjs + Изолировать двустороннее связывание данных не работает

Question

Я пытаюсь обновить список, используя директиву шаблона. Но это не обновить данные после http запроса.

test.html:

<div ng-repeat=" comment in [{name:"A"},{name:"B"},{name:"C"}]">
    <div lookup-product-icon lookup="lookupProduct(comment)"   products="products"></div>
</div>
<div lookup-products></div>
....

Директива:

var app = angular.module('myApp');
app.directive('lookupProductIcon', function() {
    return {
        scope : {
            lookup : "&"
        },
        template : '<div  ng-click="lookup()">Use me!</div>',
    };
});

app.directive('lookupProducts', function() {
    return {
        restrict : 'EA',
        transclude : false,
        scope : {
            products : '='
        },
        templateUrl : 'lists.html'
    };
});

контроллер

$scope.products = [];
        $scope.lookupProduct = function(lists) {
                var details = {
                name : lists.name,
                host : $scope.host_name
            };
            productService.lookupProduct(details).then(function(data) {
                $scope.products = data.list;
                console.log($scope.products);
                //Here display the lists in developer tools.
            }).catch(function(data) {
                if (data.message) {
                    alert(data.message);
                }
            });

        };

list.html:

<ul>
  <li ng-repeat = "product in products">    {{product.name}}    </li>
</ul>

После того, как я нажимаю "Использовать меня!" значит, мне нужно отправить запрос http, а затем отобразить списки для соответствующего содержимого в list.html.

Функция lookupProduct работает, но только продукты не обновляются.

Подробности:

Я добавил две директивы. 1. lookupProductIcon - отображение текста. Если щелкнуть этот текст, это означает, что запрос http должен быть получен, а ответ необходимо обновить в файле list.html (директива lookupProducts). 2. lookupProducts - здесь данные не обновляются.

Answer 1

Ваш lookupProducts директива имеет переменную области видимости products это не передается в вашей HTML-разметке.

Вам нужно передать множество продуктов на ваш lookupProducts директивы.

<div lookup-products products="products"></div>