пользовательская директива ничего не отображает angular js

Итак, у меня есть пользовательская директива, которая заставляет http получать запросы и отображать их в другом шаблоне. Но ничего не показывает

Файл documentdisplay.js, в котором я создал директиву

/**
 * @author Karan Shah
 * 
 */

var documentDisplayModule = angular.module('ald.documentdisplay',[]);


documentDisplayModule.factory('documentDisplayAPI',function(){
    var fac ={};

    fac.getContents = function($http,docName){
        return $htp({
            method: 'GET',
            url: "/document/getContents/docName?="+docName
        });
    };
    return fac;

});


documentDisplayModule.directive('doccontent', function () {
    return {
        restrict: 'EA',
        scope: {},
        replace: true,
        link: function ($scope, element, attributes) {
        },
        controller: function ($scope, $http,$routeParams, documentDisplayAPI) {

            documentDisplayAPI.getContents($http,$routeParams.doc).success(function(data,status){

                $scope.textofdocument = data;
            }).error(function(data,status){
                if (404==status){
                    alert("no text");
                } else {
                    alert("bad stuff!");
                }
            });            
        },
        templateUrl: "documentcontent.html"
    };
});

html-страница, на которую я это вызываю

<!-- @author Karan Shah -->
<body>
    <div>
        <h1>Document Display Contents</h1>
        <doccontent/>


    </div>
</body>

и templateUrl documentcontent.html, который имеет отображение

<body>
<div>
    Hello World
    <div>
        <a href="#/documents">Back to the List of Documents</a>
    </div>
    <br>    
    {{textofdocument}}
</div>
</body>

ошибка, которую я получаю:

Error: [jqLite:nosel] Looking up elements via selectors is not supported by jqLite! See: http://docs.angularjs.org/api/angular.element
http://errors.angularjs.org/1.2.21/jqLite/nosel
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:78:12
    at JQLite (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:2365:13)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:6816:27
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:8074:11
    at deferred.promise.then.wrappedCallback (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:11520:81)
    at deferred.promise.then.wrappedCallback (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:11520:81)
    at https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:11606:26
    at Scope.$RootScopeProvider.$get.Scope.$eval (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:12632:28)
    at Scope.$RootScopeProvider.$get.Scope.$digest (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:12444:31)
    at Scope.$RootScopeProvider.$get.Scope.$apply (https://ajax.googleapis.com/ajax/libs/angularjs/1.2.21/angular.js:12736:24)

Содержимое не отображается. Я не уверен, что здесь не так. Спасибо


javascript html angularjs angularjs-directive angularjs-factory
person Karan Shah    schedule 05.09.2014    source источник
comment
На заводе опечатка: return $htp   -  person Malk    schedule 05.09.2014
comment
Я думаю, что вы не должны использовать $http внутри директивы. Директивы сделаны для управления DOM. Чтобы получить данные с сервера или отправить данные на сервер, вы используете $http внутри контроллера или сервера.   -  person Callebe    schedule 05.09.2014
comment
хорошо, коррекция заклинаний не заставила его работать. У меня есть $http внутри директивы внутри контроллера. У меня есть другая страница, которая работает правильно с той же ситуацией. Не знаю, почему этот не работает.   -  person Karan Shah    schedule 05.09.2014
comment
Можете ли вы сделать немного больше отладки и объяснения? Ваша директива вызывается (добавьте несколько console.log в функции ссылки и контроллера)? Во вкладке сеть запрос происходит? Что ты возвращаешь? В качестве примечания у вас не должно быть тега body в вашем шаблоне...   -  person Jason Goemaat    schedule 05.09.2014
comment
Во вкладке сеть статус ОК. Однако моя директива так и не была вызвана.   -  person Karan Shah    schedule 05.09.2014
comment
ТАКЖЕ я получаю эту ошибку в консоли, которую я не знаю, что это значит. Ошибка: [jqLite: nosel] Поиск элементов с помощью селекторов не поддерживается jqLite! См.: docs.angularjs.org/api/angular.element.   -  person Karan Shah    schedule 05.09.2014
comment
Решение: stackoverflow.com/questions/13480796/   -  person Karan Shah    schedule 05.09.2014
comment
Ошибка кажется довольно понятной. Я предполагаю, что documentDisplayAPI где-то использует селекторы jquery.   -  person Jason Goemaat    schedule 08.09.2014

Ответы (1)


arrow_upward
0
arrow_downward

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

controller: function($scope, $element, $attrs, $transclude, otherInjectables) { ... }

В вашем случае $element вводится с именем $http. Когда вы пытаетесь вызвать вызов rest с помощью $http, он на самом деле пытается вызвать метод get для $element, и, следовательно, вы получаете Error: [jqLite:nosel] Попробуйте изменить контроллер на этот

controller: function($scope, $element, $attrs, $transclude, $http, $routeParams, documentDisplayAPI) { ... }

Также вам не нужно передавать $http на вашу фабрику, вместо этого вы можете напрямую ввести в фабрику

 documentDisplayModule.factory('documentDisplayAPI',function($http){
person Siraj    schedule 20.09.2014