Блог

Главная - Вопросы по программированию - Ошибка при выполнении директивы angular в системе Salesforce

Ошибка при выполнении директивы angular в системе Salesforce

#javascript #angularjs #salesforce

#javascript #angularjs #система salesforce

Вопрос:

Ошибка при использовании замены в директиве angular на Salesforce / VisualForce

Мой код директивы 

 // Shipment Addresses
myDirectives.directive('shipmentAddress', ['CartService', function(CartService){
    return{
        scope: true,
        replace: true,
        templateUrl: 'apex/shipment_addresses_tplhtml',
        controller: function($scope){
            this.addressInfo = $scope.addr;
            $scope.removeAddress = function(accountId, addrId){
                if(confirm('Are you sure you want to remove this shipping address?')){
                    CartService.deleteCartAddress(accountId, addrId).then(function(response){
                        console.log(response);
                        $scope.$emit('refreshCart');
                    });
                }
            }
        }
    }
}]);

Директива HTML

 <apex:page showHeader="false" sidebar="false" standardStylesheets="false" applyHtmlTag="false"  docType="html-5.0">
  <td>
    <div class="address-container">
      <p data-once-text="addr.street_1"></p>
                 <p data-once-text="addr.street_2"></p>
                <p><span class="once-addr" data-once-text="addr.city"></span>, 
                <span class="once-addr" data-once-text="addr.state"></span>,
                 <span class="once-addr" data-once-text="addr.zip"></span></p>
                 <p data-once-text="addr.country"></p>
                <p><a href="javascript:;" details="addr" shipment-details = "shipment-details">View</a> <span>|</span>
                 <a href="javascript:;" ng-click="removeAddress(acc.id, addr.id)">Remove</a></p>
    </div>
</td>
</apex:page>

В индексном html я вызвал код директивы как

 <tbody program-items="program-items" table-matrix="tableMatrix"></tbody>

Но я получаю сообщение об ошибке, поскольку шаблон для директивы ‘shipmentAddress’ должен содержать ровно один корневой элемент. apex/shipment_addresses_tplhtml

Комментарии:

1. Что ж, сообщение об ошибке довольно четкое, оно жалуется на то, что шаблон директивы не имеет ни одного корневого элемента. Похоже, что Angular не распознает <apex:page> как HTML-элемент (и это справедливо). Возможно, вам придется просто обернуть это в <div> или что-то в этомроде.

2. но на странице visualforce нам нужен html-элемент <apex:page>, без этого он выдает ошибку

3. Вот почему я предложил попробовать обернуть ее в <div> и не удалять.

4. Я получаю эту ошибку: <apex: page> является обязательным и должен быть самым внешним тегом в разметке в строке 1 столбца 1, когда я удалил <apex: page> . Пожалуйста, помогите мне в этом

5. Тогда не удаляйте ее, попробуйте вместо этого обернуть в <div> . То есть попробуйте поместить <div> в начало шаблона и </div> в конец шаблона, не касаясь ничего другого.