Angular Js scope.$apply does not work

Question

I am new to angular js. I am trying out an example from http://egghead.io/lessons/angularjs-directives-talking-to-controllers but somehow it does not seem to work correctly for me.

here is my html

<!DOCTYPE html>
 <html lang="en">
    <head>
    <meta charset="utf-8" />
    <title></title>
    <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js"></script>
    <script src="js/twitterApp.js"></script>
</head>
<body>
    <div ng-app="twitterApp">
        <div app-controller="AppCtrl">
            <div enter="loadMoreTweets()">Roll over to load tweets.</div>
        </div>
    </div>
</body>
</html>

here is app, controller and directive

var tApp= angular.module("twitterApp",[])

tApp.controller("AppCtrl", function ($scope) {
   $scope.loadMoreTweets = function () {
      alert('Loading tweets.');
   }
})

 tApp.directive("enter", function () {
     return function (scope, element, attrs) {
        element.bind("mouseenter", function () {
            scope.$apply(attrs.enter);    
        })
     }
 })

the problem is below statement seems to be failing and I can't figure out the reason since I did exactly the way it is done in demo.

scope.$apply(attrs.enter)

I even tried following but error console displays loadMoreTweets is not found, any help is greatly appreciated.

scope.loadMoreTweets()

If you console.log(attrs.enter) what do you see in the console? — Ben
– Ben, Commented Oct 30, 2013 at 14:57
It correctly displays the attribute value "loadMoreTweets()" but the problem was controller did not register due to my mistake. I could not figure that out because scope.$apply did not throw any error. — Raxit
– Raxit, Commented Oct 31, 2013 at 6:17

Wesley Yee · Accepted Answer · 2013-10-30 20:15:21Z

2

<div app-controller="AppCtrl">

should be

<div ng-controller="AppCtrl">

answered Oct 30, 2013 at 20:15

Wesley Yee

2002 silver badges10 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Raxit Over a year ago

Thanks for pointing out the error. The controller did not register but the behavior did register correctly so while accessing scope inside the mouseenter event it kept giving an error loadMoreTweets is not found.

Collectives™ on Stack Overflow

Angular Js scope.$apply does not work

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related