$ scope не определен в сценарии 2 - PullRequest
0 голосов
/ 01 марта 2019

Невозможно извлечь выбранное значение ng-change из раскрывающегося списка.

Я пытаюсь передать выбранное значение из раскрывающегося списка в вызов API в сценарии 2, как показано ниже, но не могу сделать это.

В инструментах разработчика Chrome было показано сообщение об ошибке как «$ scope не определен» в сценарии 2 ($ scope.changedValue = function ()).

  <!DOCTYPE html>
    <html>
    <head>
        <script src="Scripts/angular.js"></script>
        <script src="Scripts/angular-resource.js"></script>
        <script>
            var IM_Mod_app = angular.module('IM_ng_app', []);

            // script 1: To fetch all flrs from API call. - working as expected. IM_Mod_app.controller("IM_Ctrl", function ($scope, $http) {
            $http({
                method: 'GET',
                url: 'http://localhost:55762/api/ItemMaintenance/GetAllFlavors',
                params: { Id: 'US06' }
            }).then(function successCallback(response) {
               // alert(response.data);         
                $scope.flavours = response.data;
            }, function errorCallback(response) {
                     // alert(response);
                });           
        });

// Script: 2 - извлечь выбранное значение и передать его в API для получения данных.

               // IM_Mod_app.controller("IM_Ctrl", function ($scope) {
        $scope.changedValue = function () {
            alert("h1111i");
                $scope.selectedvalues = $scope.flv.FLAVOR_ID;
            }.then(function successCallback(response) {
                // success on on change event - call api to get data
                alert("hi");
                $http({
                    method: 'GET',
                    url: 'http://localhost:55762/api/ItemMaintenance/GetAllFlavors',
                    params: { Id: 'US15' }
                }).then(function successCallback(response) {
                    // scuucess on fetching data from api call
                    // alert(response.data);

                    $scope.flavours = response.data;
                }, function errorCallback(response) {
                    // error on fetching data from api call
                    // alert(response);
                });
                $scope.flavours = response.data;
            }, function errorCallback(response) {
                //  error on onchange event
            });
       // });             
    </script>

</head>

    <body ng-app="IM_ng_app">
        <div ng-controller="IM_Ctrl">
            <select ng-model="flv"
                    ng-options="flv.FLAVOR_ID for flv in flavours"
                    ng-change="changedValue(flv)">
                <option value="">Select Flavor</option>
            </select>
           <h1>{{flv.FLAVOR_ID}}</h1>

        </div>  
    </body>
    </html>

Похоже, что он не входил в сам скрипт 2 (Не срабатывает предупреждение msg в скрипте2).

Может ли какой-либо орган помочь мне в вышеуказанном вопросе.

Ответы [ 3 ]

0 голосов
/ 01 марта 2019
IM_Mod_app.controller("IM_Ctrl", function ($scope) { $scope.changedValue = function () { alert("h1111i"); $scope.selectedvalues = $scope.flv.FLAVOR_ID; }.then(function successCallback(response) { // success on on change event - call api to get data alert("hi"); $http({ method: 'GET', url: 'http://localhost:55762/api/ItemMaintenance/GetAllFlavors', params: { Id: 'US15' } }).then(function successCallback(response) { // scuucess on fetching data from api call // alert(response.data); $scope.flavours = response.data; }, function errorCallback(response) { // error on fetching data from api call // alert(response); }); $scope.flavours = response.data; }, function errorCallback(response) { // error on onchange event }); 
}); 
0 голосов
/ 02 марта 2019

Используйте приведенный ниже код.

  IM_Mod_app.controller("IM_Ctrl", function ($scope, $http) {
                $http({
                    method: 'GET',
                    url: 'http://localhost:55762/api/ItemMaintenance/GetAllFlavors',
                    params: { Id: 'US06' }
                }).then(function successCallback(response) {
                   // alert(response.data);         
                    $scope.flavours = response.data;
                }, function errorCallback(response) {
                         // alert(response);
                    });  
     $scope.changedValue = function () {
                   // alert("hgjhhg");
                    alert($scope.flv.FLAVOR_ID);
                    // success on on change event - call api to get data
                    $http({
                        method: 'GET',
                        url: 'http://localhost:55762/api/ItemMaintenance/GetAllFlavors',
                        params: { Id: 'US15' }
                    }).then(function successCallback(response) {
                        alert(response.data);
                        $scope.flavours = response.data;
                    }, function errorCallback(response) {
                        // alert(response);
                    });
                }
            });

Закрывающие скобки - это проблема.Надеюсь, это сработает.

0 голосов
/ 01 марта 2019

Проблема здесь в том, что у вас есть значение flv в двух местах, которое кажется конфликтующим, а именно ng-model="flv" и flv внутри ng-options.

<select ng-model="flv" ng-options="flv.FLAVOR_ID for flv in flavours" ng-change="changedValue(flv)">
    <option value="">Select Flavor</option>
</select>

Изменить значение flv до flavor в ng-options должны решить проблему

ng-options="flavor.FLAVOR_ID for flavor in flavours"
...