if we have to pass templateUrl through attrs then what to do?
currently I am doint like this
<tempurl path="GenInfoTemp.html"></tempurl>
.directive('tempurl', function () {
return {
restrict: 'E',
scope: {
path: '='
},
link: function (scope) {
debugger;
scope.$watch('source', function (element) {
debugger;
}, true);
},
templateUrl: function (scope,element,attrs) {
debugger;
attrs.path;
return scope.path;
}
};
});
On Friday, November 30, 2012 11:10:01 PM UTC+5, Nash wrote:
>
> Resolved - ended up being just a bad relative file path in django.
> Looking at the server get request cleared this up. Curiously, though, the
> debug output in chrome only gives a 404 (Not Found) response when using the
> leading slash for domain relative paths. When I give it an invalid
> relative path (no leading slash) in the templateUrl the 404 error never
> fires and I get the previous "template must have exactly one root
> element..." error. Is this common behavior?
>
> Either way, point is: check the server get response first to double check
> you're pointing to a valid file.
>
> On Friday, November 30, 2012 9:06:43 AM UTC-8, Peter Bacon Darwin wrote:
>>
>> Check for whitespace in your template. You appear to have multiple top
>> level dom nodes in it.
>>
>> Pete
>> ...from my mobile.
>> On Nov 30, 2012 4:00 PM, "Nash" <[email protected]> wrote:
>>
>>> I started with the exact same issue as Robert - can't make the switch
>>> from inline template definition to templateUrl. template:[...] works just
>>> fine, but templateUrl with the same html now gets me the following error,
>>>
>>> Error: Template must have exactly one root element. was: <html lang="en">
>>>
>>>
>>> I've been messing with the DOM structure in the index file and the
>>> partial template file thinking that's the issue, but I'm not having much
>>> luck. The only suggestion I've found so far is removing 'replace:true',
>>> however, this just results in an infinite rendering loop that blows up
>>> Chrome eventually. What am I missing here?
>>>
>>> *Index.html,*
>>> <html lang="en">
>>> <head>[...]</head>
>>> <body ng-app="myApp">
>>> *<my-elm></my-elm>*
>>> </body>
>>> </html>
>>>
>>> *app.js*
>>> var myApp = angular.module('myApp', []);
>>>
>>>
>>> *directives.js, *
>>> myApp.directive('myElm', function(){
>>> return {
>>> restrict: 'E',
>>> replace: true,
>>> transclude: true,
>>> templateUrl: 'partials/myElm.html'
>>> }
>>> });
>>>
>>> *partials/myElm.html,*
>>> <div>
>>> <div>Hello</div>
>>> </div>
>>>
>>> N.
>>>
>>>
>>> On Wednesday, April 11, 2012 11:19:14 AM UTC-7, Robert B. Weeks wrote:
>>>>
>>>> Hey -
>>>>
>>>> Hmm - ok - the docs say it both ways -the example element does say that
>>>> - sorry 'bout that - but the description shows it the other, that is where
>>>> my confusion came from:
>>>>
>>>> "templateURL - Same as template but the template is loaded from the
>>>> specified URL. Because the template loading is asynchronous the
>>>> compilation/linking is suspended until the template is loaded."
>>>>
>>>> It does work with it like below (sigh). Thanks for the pointer.
>>>>
>>>> One thing I did note though, is if the included html file begins with a
>>>> comment (like to describe what it is), it will not load either.
>>>>
>>>> Thanks for the reply. This helped a ton.
>>>>
>>>>
>>>> On Apr 11, 2012, at 1:57 PM, Igor Minar wrote:
>>>>
>>>> > It's templateUrl not templateURL
>>>> >
>>>> > /i
>>>> >
>>>> > On Wed, Apr 11, 2012 at 10:50 AM, Robert B. Weeks <[email protected]>
>>>> wrote:
>>>> > Hey -
>>>> >
>>>> > That is what I figured as well, but I am not seeing that happen.
>>>> >
>>>> > I can't figure out how to mimic really in a fiddle, but to show what
>>>> I am seeing - this path works fine:
>>>> >
>>>> > <ng-include src="'/resources/templates/replacement.html'"></ng-
>>>> include>
>>>> >
>>>> > but using same path in a directive is not giving what I am expecting.
>>>> I have checked the network/xhr consoles as usual - but never see it try to
>>>> grab it
>>>> >
>>>> > With the call:
>>>> >
>>>> > <current-dataset>Testing the current-dataset for
>>>> {{serverName}}</current-dataset>
>>>> >
>>>> > This works fine - with 'template' defined:
>>>> >
>>>> > var appDirectives = angular.module('app.directives', []);
>>>> > appDirectives.directive('currentDataset', function () {
>>>> > return {
>>>> > restrict: 'E',
>>>> > replace: true,
>>>> > transclude: true,
>>>> > template: '<div>Replacement Content</div>'
>>>> > }
>>>> > });
>>>> >
>>>> > But if I have that same template in the file listed in the ng-include
>>>> above:
>>>> >
>>>> > appDirectives.directive('currentDataset', function () {
>>>> > return {
>>>> > restrict: 'E',
>>>> > replace: true,
>>>> > transclude: true,
>>>> > templateURL: '/resources/templates/replacement.html'
>>>> > }
>>>> > });
>>>> >
>>>> > I get nothing, nor do I see any attempt to grab it via xhr in the
>>>> consoles. Am I doing something wrong in the call above? I have tried
>>>> wrapping it in '"xxx"' and "'xxx'". Do I need to do something special in
>>>> the compile or link function?
>>>> >
>>>> > Thanks - sorry I can't get to work in a fiddle - not sure how I would
>>>> show that there.
>>>> >
>>>> >
>>>> >
>>>> > > It will check the cache for inlined templates and if one is not
>>>> found it will make an xhr to the url to fetch the template.
>>>> > >
>>>> > > the url with "/" prefix is relative to the domain, without the "/"
>>>> prefix it will be relative to the main ("index.html") page or base url (if
>>>> you use location in the html5 mode).
>>>> > >
>>>> > > /i
>>>> > >
>>>> > > On Wed, Apr 11, 2012 at 8:38 AM, Robert B. Weeks <[email protected]>
>>>> wrote:
>>>> > > Hello -
>>>> > >
>>>> > > Just to follow up on this question -
>>>> > >
>>>> > > Is this what the 'templateURL' is used for?
>>>> > >
>>>> > > In the docs it says "Same as template but the template is loaded
>>>> from the specified URL" - I have been trying to get this to work as well.
>>>> > >
>>>> > > So if I had a config for something like:
>>>> > >
>>>> > > return {
>>>> > > restrict: 'E',
>>>> > > replace: true,
>>>> > > scope: {
>>>> > > myName: 'attribute'
>>>> > > },
>>>> > > templateURL: '/path/to/my/file.html',
>>>> > > link: function(scope, iElement, iAttrs, controller) {...}
>>>> > > };
>>>> > >
>>>> > > Does 'templateURL' only take an id from an inlined template? Should
>>>> we try to mimic what ng-include does in our own directives if we need to
>>>> load the templates from the outside?
>>>> > >
>>>> > > Thanks for any info.
>>>> > >
>>>> > >
>>>> > > > I was curious on the 'templateURL' field when creating a
>>>> directive. What is this path relative to? I have had a hard time getting
>>>> it
>>>> to read in a file as the replacement for the template, and have tried
>>>> multiple paths to do so.
>>>> > > >
>>>> > > > That is what this field is for - correct? It looks that way
>>>> according to the docs.
>>>> > > >
>>>> > > > Thanks.
>>>> > > >
>>>> > >
>>>> >
>>>>
>>>> --
>>>> Robert B. Weeks
>>>>
>>>>
>>>> --
>>> You received this message because you are subscribed to the Google
>>> Groups "AngularJS" group.
>>> To post to this group, send email to [email protected].
>>> To unsubscribe from this group, send email to
>>> [email protected].
>>> Visit this group at http://groups.google.com/group/angular?hl=en-US.
>>>
>>>
>>>
>>
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
