javascript - Value not changing when radio button is pressed - AngularJS -
what i'm trying when product selected different types of product brought in browser. here's got:
script.js
function showctrl($scope, $http) { $scope.products = [ { "category":"pens", "label":"p1", "images":"d-u-b/pens.png" }, { "category":"cozies", "label":"p2", "images":"d-u-b/cozie.png" } ]; $scope.prod = {"name": "cozies"}; $scope.typselect = 'plain'; $http.get("products/"+$scope.prod.name+".json").success(function(data){ $scope.type = data; }); }
customo.php(code snippet being called)
<div class="pro" ng-repeat="product in products"> <label for="{{product.label}}" class="p"> <input id="{{product.label}}" type="radio" ng-model="prod.name" name="name" value="{{product.category}}"/> <h3>{{product.category}}</h3><img ng-src="{{product.images}}" alt="{{product.category}}"/> </label> </div>
my problem prod.name not changing in js , not calling correct json file. displayed prod.name in html , changes correctly when click radio button types not change according product selected.
can see i'm doing wrong , how fix it?
thats because javascript code not paying attention changes of variable. make controller observe prod.name
need use $watch method of $scope
variable.
$scope.$watch('prod.name', function () { $http.get("products/"+$scope.prod.name+".json").success(function(data){ $scope.type = data; }); });
Comments
Post a Comment