CODEWITHSUNDEEP
javascriptangularjs
mmisiarek
mmisiarek

Reputation: 191

Angular binding doesn't work inside of any tag

Problem seems to be easy but I have no idea how to resolve it. I set one variable to scope and then I want to update it. The problem is that it is working in that way:

<button>{{number}}<button>

But in that way it doesn't:

<button><span>{{number}}</span></button>

Any ideas?

Upvotes: 0

Views: 122

Answers (3)

user2094364
user2094364

Reputation: 1

It is working fine and please see the below the code snippet. It is helpful for you

index.html

<html ng-app = "MyApp">
<head>
  <script src = "angular.min.js"></script>
  <script src = "controller.js"></script>
</head>
<body  ng-controller="myController">
 <div>
   <span>{{number}}</span>
 </div>
</body>
</html>

controller.js

var app = angular.module('MyApp', []);
app.controller('myController', ['$scope', function($scope){
  $scope.number = 10;
}]);

Please refer the same in following link http://plnkr.co/edit/p5N3HZnHqjLXJg3KBZuL?p=preview

Upvotes: -1

Foo
Foo

Reputation: 158

Hard to tell exactly what's going on without a larger code example. Are there any errors being thrown in your console?

Perhaps if you compare your code to this it may illuminate what's going wrong.

HTML

<body ng-app="app">
 <div ng-controller="numberController">
    <input type="text" ng-model="number" />
    <br />
    <span>Span number: {{ number }}</span>
 </div>
</body>

JS

var app = angular.module('app', []);

app.controller('numberController', ['$scope', function ($scope) {
  $scope.number = 123;
}]);

Simple angularjs fiddle demo of above code

Upvotes: 2

PaReeOhNos
PaReeOhNos

Reputation: 4428

Not entirely sure why that isn't working, but try doing one of the following

<span ng-model="number"></span>
<span ng-bind="number"></span>

See if that works

Upvotes: 0

Related Questions