CODEWITHSUNDEEP
javascriptangularjsangularjs-directive
Run
Run

Reputation: 57226

How to use directive to load an external template in Angular?

How can I use directive to load an external template in Angular?

Angular,

app.directive('helloWorld', function() {
    return {
        restrict: 'AE',
        replace: true,

        //templateUrl points to an external html template.
        emplateUrl: 'fixture/main.html'
    };
});

html,

fixture/main.html,

<div ng-controller="SimpleController">{{sayHello()}}</div>

Nothing is loaded. Any idea what have I missed?

Upvotes: 0

Views: 2300

Answers (1)

Anik Islam Abhi
Anik Islam Abhi

Reputation: 25352

Use this 

app.directive('helloWorld', function() {
    return {
        restrict: 'AE',
        replace: true,

        //templateUrl points to an external html template.
        templateUrl: 'fixture/main.html'
    };
});

and in HTML

<div ng-controller="SimpleController"><div hello-world></div></div>

Upvotes: 1

Related Questions