Valyrion
Valyrion

Reputation: 2603

AngularJS controller never gets executed

I'm getting started with AngularJS and I've written a simple controller function in an external file. I load this file on my html page, set the body to have ng-controller="myController" and have a simple output. The problem is that the controller never actually gets executed and I haven't the slightest idea why. I've tried moving it to be an inline script and still nothing.

Html part:

<script src="scripts/angular.min.js"></script>
    <script src="scripts/angular-route.min.js"></script>
    <script src="scripts/init.js"></script>
    <script src="controllers/contactlistcontroller.js"></script>
    <script src="scripts/modules.js"></script>
    <script src="scripts/inline.js"></script>

    <title>Augmented Contactlist</title>
</head>
<body ng-controller="myController">
        <ul>
        <li ng-repeat="c in contacts">Test</li>
        </ul>

Controller:

function myController($scope){
    alert("called");
    function getContacts(){
        //Dummy contacts
        var contacts = [
            {name: 'Testy Testerson', inPhone: false, inSF: true, id: '003i000000hUCdp'},
            {name: 'Randy Testerson', inPhone: false, inSF: true, id: '003i000000hUCdp'},
            {name: 'Steve Testerson', inPhone: false, inSF: true, id: '003i000000hUCdp'},
            {name: 'Herbert Testerson', inPhone: true, inSF: true, id: '003i000000hUCdp'},
            {name: 'Phony Testerson', inPhone: true, inSF: false, id: '003i000000hUCdp'}
        ];
        return contacts;
    }

    function getSFContacts(){

    }

    function getPhoneContacts(){

    }

    //Variables
    $scope.contacts = getContacts();
}

Upvotes: 0

Views: 155

Answers (1)

anon
anon

Reputation:

You're missing the ng-app directive that tells angular it's an angular application and to kick in and parse the html, you need ng-app on your html:

https://docs.angularjs.org/api/ng/directive/ngApp

Try this tutorial for a bit more detail: http://tutorials.jenkov.com/angularjs/index.html

As you use more angular you use your app to register modules and add services to your angular application.

Upvotes: 3

Related Questions