не может вызвать $ http в angularjs

Question

Я хочу вызвать службу через http для раскрывающегося списка в angularjs. Но функция не будет выполнять метод службы http.

Я связываю выпадающий список с помощью вызова ajax, после привязки вызова ajax я хотел бы показать детали выбранного значения из вызова ajax.

 <script type="text/javascript">
    var app = angular.module('myApp', [])
    app.controller('myCtrl', function ($scope, $http, $window) {
        $scope.DefaultLabel = "Loading.....";
        var post = $http({
            method: "POST",
            url: "/PIRDetails/AjaxMethod",
            dataType: 'json',
            data: {},
            headers: { "Content-Type": "application/json" }
        });
        post.success(function (data, status) {
            $scope.DefaultLabel = "Please Select PIR Device";
            $scope.Customers = data;
        });
        post.error(function (data, status) {
            $window.alert(data.Message);
        });

        $scope.getPIRData = function (id) {
            $http.get("/PIRDetails/GetPIRStatus/e203")
                .then(function (response) {
                    $scope.myWelcome = response.data;
                });
        };
    });

</script>
<div ng-app="myApp" ng-controller="myCtrl">
    <select class="form-control" onchange="getPIRData(this.value);">
        <option value="0" label="{{DefaultLabel}}"></option>
        <option ng-repeat="customer in Customers" value="{{customer.Value}}">{{customer.Text}}</option>
    </select>
</div>

Answer 1

Попробуйте ng-change, а не onchange

<div ng-app="myApp" ng-controller="myCtrl">
    <select class="form-control" ng-change="getPIRData(this.value);">
        <option value="0" label="{{DefaultLabel}}"></option>
        <option ng-repeat="customer in Customers" value="{{customer.Value}}">{{customer.Text}}</option>
    </select>
</div>

A Демо-код здесь

Answer 2

Как упомянуто в комментарии @ sinkatonte, то, как вы используете angularjs, совершенно неверно. Вам не нужно определять приложение angularjs и контроллер внутри функции. Для исправления кода используйте следующий способ.

var app = angular.module('myApp', []);
app.controller('myCtrl', function ($scope, $http) {
    $scope.getPIRData = function(id) {
        $http.get("/PIRDetails/GetPIRStatus/e203")
            .then(function (response) {
                $scope.myWelcome = response.data;
        });
   };
});


<div ng-app="myApp" ng-controller="myCtrl">
    <select class="form-control" ng-change="getPIRData(this.value);">
        <option value="0" label="{{DefaultLabel}}"></option>
        <option ng-repeat="customer in Customers" value="{{customer.Value}}">{{customer.Text}}</option>
    </select>
</div>

Убедитесь, что response.data в $ http возвращает данные в правильном формате и что для this.value есть значение, используемое в ng-change = "getPIRData (this.value)