I need to bind a variable with a JS object's property. Is it possible ?
In my controller
...
$scope.data = "initial value";
$scope.obj = {data : $scope.data}
...
And in my View
<input type="text" ng-model="data">
<h1> {{ obj.data }} </h1>
When i update the text in my input box it should update the value in <h1> and it should be done through the object.
No functions, No watchers or anything, Just with binding. Is it possible ?
This is my question simplified. what im trying to do is create a object with some changing variables, and pass it to an AngularJS component where it will display the value changes. I need to pass an object, not different values individually.
2 Answers 2
bind your object with ng-model
.............
$scope.obj = {data : "initial value"}
................
your view
<input type="text" ng-model="obj.data">
<h1> {{ obj.data }} </h1>
Sign up to request clarification or add additional context in comments.
Comments
You should use <input type="text" ng-model="obj.data">
DEMO
var app = angular.module('testApp',[]);
app.controller('testCtrl',function($scope){
$scope.data = "initial value";
$scope.obj = {data : $scope.data}
});<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="testApp" ng-controller="testCtrl">
<input type="text" ng-model="obj.data">
<h1> {{ obj.data }} </h1>
</body>
answered Aug 24, 2017 at 4:29
Sajeetharan
223k65 gold badges370 silver badges410 bronze badges
1 Comment
Sathya R
delete the line
<input type="text" ng-model="obj.data">, and manipulate obj.data through javascript function. will that work?default
ng-model="obj.data"?