In view function not called

[rj93]

Hi,

I am trying to get this to work angular 1.5.0-beta.1

HTML

<div class="row">
    <div class="col-md-8 col-md-offset-2" in-view-container>
        <div class="jumbotron" id="section" ng-repeat="category in cvCtrl.categories" id="{{ category.id }}" in-view="lineInView($index, $inview, $inviewpart, $event)">
            <h3> {{ category.name }} </h3>
            <p>Something here</p>
        </div>
    </div>
</div>

CSS

#section {
    height: 500px;
}

Controller

(function() {
    angular.module("websiteApp")
        .controller("CvController", function(){

            this.categories = [
                { name: "profile", id: "profile", content: "" }, 
                { name: "education", id: "education", content: "" }, 
                { name: "skills", id: "skills", content: "" }, 
                { name: "work experience", id: "work", content: "" }
            ];

            this.lineInView = function(index, inview, inviewpart, event) {
                console.log("called");
                return false;
            }

        });
})();

Can you please tell me where I'm going wrong?

Thanks.

[ScottSpittle]

I think it's because this.lineInView is not on the scope, it's the controller as syntax. Try changing it to $scope.lineInView = function()....

[rj93]

It was to do with that, I needed to call cvCtrl.lineInView(...). Knew I was overlooking something!