CODEWITHSUNDEEP
javascriptangularjselectron
Nikita Popov
Nikita Popov

Reputation: 895

Angular directive is not showing

Electron + AngularJS
I'm doing some basic stuff: I'm trying to add header and footer which will be showed on every page.
So I have app.js like this: 

'use strict';
let app = angular.module('marks', ['ngRoute']);
app.controller('ctrl', ($scope) => {})
    .config(($logProvider, $routeProvider) => {

    $logProvider.debugEnabled(true);

    $routeProvider
        .when('/', {
            templateUrl: 'html/home.html'
        })
        .when('/login', {
            templateUrl: 'html/login.html'
        })
        .when('/teachers', {
            // controller: 'js/teachers.controller.js',
            templateUrl: 'html/teachers.html'
        })
        .when('/students', {
            // controller: 'js/students.controller.js',
            templateUrl: 'html/students.html'
        })
        .when('/404', {
            templateUrl: 'html/404.html'
        })
        .otherwise({ redirectTo: '/404' });
});

footer.controller.js: 

angular.module('marks').controller('MarksFooterController', ['$scope', ($scope) => {}]);

footer.directive.js:

angular.module('marks').directive('marksFooter', () => {
    return {
        restrict: 'EAC',
        controller: 'MarksFooterController',
        templateUrl: '../html/marks-footer.html'
    };
});

marks-footer.html: 

<div>
    <h3>2017</h3>
</div>

and the same for header.

index.html 

<!DOCTYPE html>
<html>
<head>
    <script src="../../bower_components/angular/angular.js"></script>
    <script src="../../bower_components/angular-resource/angular-resource.js"></script>
    <script src="../../bower_components/angular-route/angular-route.js></script>
</head>
<body ng-app="marks">
<div class="tile is-ancestor is-12">
    <div class="tile is-vertical is-parent is-9">
        <ng-view></ng-view>
    </div>
</div>

    <script>
        require('./app.js');
    </script>
</body>
</html>

When I run the app, I get no errors, but directives are empty (but they get params as well), so what's the problem?

Screenshot with DevTools : enter image description here I think that I mess up with controllers somehow, but I'm not sure.
This answer doesn't help.
Appreciate any help

UPDATE

Now I get it trying to load templates somehow (perhaps some changes with tag position helped), but app can't find it. DevTools -> Sources shows no html folder (screenshot). Where should I import it?

SOLVED
The solution was:

But I'm still looking how to avoid so many imports inside .html

Upvotes: 2

Views: 854

Answers (1)

yu.pitomets
yu.pitomets

Reputation: 1840

The problem is how you including your app.js script. It should be included as tag in header or in any other place.

Upvotes: 2

Related Questions