How to populate Angularjs $scope variable in javascript?

angularjs, javascript

Solution

Accesing scope from external element:

on(document.getElementById("button"), "click", function (e) {
            var scope = angular.element(document.getElementById("foo")).scope();
            scope.name = "hello, World!";
    })

Problem

``` mapApp.controller("myController", function ($scope,$http) { $scope.namePlaceHolder= "Name"; $scope.name = ""; }; ``` I bound a scope variable to an html input as follows. ``` <input id="foo" type="text" placeholder="{{namePlaceHolder}}" ng-model="name" value="{{name}}"/> ``` If a user types something in text box the $scope.name property changes. But when I change it using javascript the $scope.name data doesn't change. ``` on(document.getElementById("button"), "click", function (e) { document.getElementById("foo").value = "ascd..."; }) ``` This code does not populate $scope.name data.

Original source