angularjs - Angular events, ng-click, do not work with other libraries Dojo, Knockout, KendoUI, ESRI JSAPI

Question

Continued from this post - Why does ng-click not work?

So I am in the early phases of converting a non-Angular application to Angular. We have not been given the option to do a clean re-write.

This application uses Dojo, require.js, Knockout, ESRI JSAPI, and KendoUI. Using the simple plunker code here:

https://plnkr.co/edit/kK3NmWB9wfOopG7m5MYv?p=preview

$scope.myClick 

does not get called from within this other application.

I have determined that depending on where the Angular app is placed in the index.html file, this affects Angular click and keypress, and probably other events. If I place the app in the HTML before any of the other code, this starts working.

tl;dr Or any ideas on how to isolate Angular code from an existing non-Angular application?

Thanks

Answer 1

Hope this helps anyone who has a similar problem -

Turns out, this code was what was affecting the angular events:

 <!--ko if: someContext.ready() === true-->
     <div class="ls-rapidReports">
     <div ng-app="myApp">
        <div id="rapidreportCtrl" ng-controller="rrController">
            <button type="button" ng-click="myClick()">hehe</button>
        </div>

    </div>
  </div>
<!--/ko-->

So wrapping Angular components inside Knockout is BAD.