Используя AngularJS, как передать область контроллеров в HTML-шаблон директив

0

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

В настоящее время даже несмотря на то, что я удаляю контроллер из проекта, значение выражения в составной.html отображает "0".

Как передать контрольный элемент "compositeController" в шаблон "composite.html"?

Индекс

<compound objectid="{{controll.compoundId}}"></compound> 

директива

angular.module('ireg').directive('compound', function () {
    return {
        restrict:'E',
        scope: {             
            objectid:'@objectid'
        },
        controller: 'compoundController',
        templateUrl: 'compound.html'
    }
});

контроллер

angular.module('ireg').controller("compoundController",
  ['$scope','$routeParams','compoundService', 
  function($scope,$attrs,compoundService ){
    var vm = this;
    vm.objectid = 2;
    vm.compoundData;

    vm.getPayload = function(scope, compoundController){
        var promise = compoundService.getData($scope.objectid);
        promise.then(
            function(payload) { 
                vm.compoundData = payload.data[0];
            }
        );
    };

}]);

обслуживание

angular.module('ireg').factory('compoundService', function($http) {
    return {
        getData: function(id) {
            var url = "http://localhost:8080/return-compound-data.php?compound=" +id;
            return $http.get(url);
        }
    }
});

Compound.html

    <div class = "panel-heading">
        <div class="card-title"> {{compound-controller.compound-data.project_name}} </div>
    </div>  <!-- end of panel heading -->

    <div class = "panel-body" >
        <table class = "rwd-table">
            <tr>
                <th>Compound Number</th>
            </tr>
            <tr> 
                <td data-th="Compound Number">{{controll.compound_number}}</td>
            </tr>
        </table>
    </div>

</div>

1 ответ

0

Используйте оператор '=' в директиве для отображения области видимости и оставляйте фигурные скобки в теге html.

<compound objectid="controll.compoundId"></compound>

 scope: {             
        objectid:'=objectid'
    },

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

Ещё вопросы

Сообщество Overcoder
Наверх
Меню