I support a host of WPF and web apps with differing technologies. I am a novice with AngularJS. I have tried a host of suggestions and other ways to get this to work but I cannot figure it out. I am sure I am just missing something obvious.

I just want to get this ng-click event to post a log to the console in chrome. Can someone tell me why this ng-click event will not fire?


Using VS 2015, ASP.net MVC Web Application.
These are the locations and contents of my cshtml and js files...

Views\Home\index.cshtml
@{
ViewBag.Title = "Home Page";
}


<div class="jumbotron">
<h1>File Uploader</h1>
<p class="lead">Upload up to 5 files with a max file size of 12mb per file.</p>

<!-- Upload -->
<section class="row thematic-wrapper">
<div ng-controller="Uploader" class="col-sm-12">
<label class="lbl">Upload Documents >>>> |</label>
<button class="btn" ng-click="UploadFile()" >
Test Button
</button>
</div>
</section>

</div>


Scripts\Uploader.js

'use strict'

$scope.UploadFile = function () {
$log.log("Welcome to Uploader.js!")
$console.log("Welcome to Uploader.js!")
}




I posted this on stackoverflow and lost 6 reputation??

I don't think your angular controller is set up properly. Bring up your Javascript console in your browser, and check if any errors are logged. Can you post your complete controller code?

This is the "out of the box" controller that I have. No errors in the console.

here is a very basic controller and view. These two files will work if you open index.html in your browser. Look at how the controller is defined. That's what you need to do in your code. Also look at index.html where ng-app is referenced near the top of the file. I think your sample was missing that.

The 'out of the box' controller you just posted is actually an ASP. Net MVC controller, which is different than an angular controller. You want to look at your angular controller, which you named uploader.js

Thank you for your suggestions.

Ok I wasn't sure, that was my entire js file.

I can get ng-click to work in any plunker type editor. It's in Visual Studio that I can't make it work.

Here are my latest updates, still not working. No errors on build or in the console. Running in incognito to ensure it's not a caching issue...

Well, you are using ng-app twice... Once in the layout file, and again in the cshtm file. Try taking it out of the cshtm file. Are you getting any errors logged to the console?

I also don't see anywhere in your code where you're loading uploader.js. You have to load that file in one of your cshtml files. It also doesn't look like you're loading the angular files. Take a look at how I load angular in the sample code I posted. You need to add a line like that to your code, and also a line where you load the uploader.js file. Unless you're already loading them in one of your bundles.

Thank you so much for the help, it's working now!

Glad to help. Let me know if you have anymore questions.