AngularJS/Javascript dropdown “onchange” function is not working

Question

<select name="Connection" class="mdl-button" id="dropConnection" onchange="connectionChange()" ></select> 

The contents are added automatically from JSON response.Thats working fine.

function connectionChange()
{
    var sel = document.getElementById("dropConnection");
    var connectionName = sel.options[sel.selectedIndex].text;
  $scope.connectionDetail = response.data.message.connectionDetailses.filter(det => det.connectionId === connectionName);
  console.log($scope.connectionDetail);
}

after running the page,when I change the dropdown content its showing error

home.html:265 Uncaught ReferenceError: $scope is not defined
    at connectionChange (home.html:265) // above javascript code.
    at HTMLSelectElement.onchange (VM4122 home.html:139)

Answer 1

home.html:265 Uncaught ReferenceError: $scope is not defined
    at connectionChange (home.html:265) // above javascript code.
    at HTMLSelectElement.onchange (VM4122 home.html:139)

Looking at this error it can be inferred that you have not injected $scope in your controller. Inject $scope in your controller and it will resolve this error.

Check the link here for knowing how to create a controller in AngularJS properly AngularJS controller