CODEWITHSUNDEEP
javascripthtmlangularjs
tbddeveloper
tbddeveloper

Reputation: 2447

Weird markup/binding behavior while using angular

This is not a major issue, but I've never seen the behavior I'm about to describe, and I thought if a group of people could help me understand it, it would be you guys. Basically, when I put a button in a header, my data-ng-click did not fire. When I wrote out the same line again, the click worked fine. My question is basically, am I missing something with my code that causes my issue? I'll go through the steps I've just followed to troubleshoot this;

I have a page, it looks like;

<div data-ng-app="myApp" data-ng-controller="myController">

    <h1>Title<button type="button" class="btn btn-primary pull-right" data-ng-click="showMe()">Click Me</button></h1>

I click the button, the showMe function which is defined in $scope in my controller doesn't alert as I would expect. So, I modify my code;

<div data-ng-app="myApp" data-ng-controller="myController">
     <a href="#" data-ng-click="showMe()">Click Me</a>
    <h1>Title<button type="button" class="btn btn-primary pull-right" data-ng-click="showMe()">Click Me</button></h1>

And the alert shows. So, I wonder if it's something to do with my putting the button in header causing some issues for whatever.

<div data-ng-app="myApp" data-ng-controller="myController">

    <div class="row">
    <h1>Title</h1>
     <button type="button" class="btn btn-primary pull-right" data-ng-click="showMe()">Click Me</button>
    </div>

And nothing works. So, I decided to type out the same button again, above the existing button and see if a particular element was causing an issue. I started with button with data-ng-click. Alert fires. I keep adding things back in until I get

    <button type="button" class="btn btn-primary pull-right" data-ng-click="showMe()">Click Me</button>
    <button type="button" class="btn btn-primary pull-right" data-ng-cliok="showMe()">Click me</button>

And the new button works. So, I delete the new button, the old button doesn't work. I delete the old button, the new button works. I open the file in a text editor and show all characters, nothing out of the ordinary, it's not a result of any copy and paste mistake.

I'm obviously going to leave the new button in place, but if I an explanation is possible, then I would like to try and get one.

Upvotes: 0

Views: 39

Answers (1)

tbddeveloper
tbddeveloper

Reputation: 2447

So, pixelbits pointed out my issue. On my monitor, the font I was using in the editor makes very little distinction between the c and an o in the word click. Even though I believed myself to have read over the line several times, it wasn't until I went back to look at the line looking for that particular issue that I realized I had just completely overlooked it.

Thank you pixelbits, and thank you guys for taking the time to look.

Upvotes: 0

Related Questions